/* Load core in favor of the old load color-scheme */
/* The core will from now on really be the core. If anything gets changed here it will change in all themes */
@import url('https://fonts.googleapis.com/css?family=Poppins:400,700');
@import url('https://fonts.googleapis.com/css?family=PT+Serif:400,700');

/* Color Schemes */
/* Edit this only! */
@primary-color: #1C1D1E;
@secondary-color: #26262B;
@thirth-color: #004B96;
@fourth-color: #B9C0E1;
@fifth-color: #DBE3EE;
@btn-color-hover: #404040;
@btn-color-focus: @btn-color-hover;
@second-btn-color-hover: @primary-color;
@light-gray-color: #f9f9f9;
@medium-gray-color: #ccc;
@darkgray-color: #404040;
@dark-gray-color: #ccc;
@light-color: #ededed;
@gradient-start-color: #1d9cd8;
@gradient-end-color: #0460aa;
@heading-color: #1e1e1e;
@font-color: #1e1e1e;

/* Style definitions */
@border: 1px solid rgba(33, 33, 33, 0.33);
@border-radius: 0px;

/* Fonts */
@primary-font: 'Chivo', sans-serif;
@secondary-font: 'Open Sans', sans-serif;

/* Header */
/* Primary header */
@primary-header-background-color: #1C1D1E;
@primary-header-icon-color: #fff;

/* Secondary header */
@secondary-header-background-color: #4a4a54;
@secondary-header-border-top: none;

/* Top bar */
@top-bar-background-color: @fourth-color;
@top-bar-font-size: 12px;
@top-bar-text-color: #fff;
@top-bar-link-color: #fff;
@top-bar-link-hover-color: #ccc;
@top-bar-icon-color: #4d4e4c;

/* Navigation */
@navigation-link-background-color: transparent;
@navigation-link-color: #999da0;
@navigation-link-hover-color: #fff;
@navigation-link-hover-background-color: @thirth-color;
@navigation-link-hover-color: #fff;
@navigation-link-focus-background-color: @thirth-color;
@navigation-link-focus-color: #fff;
@navigation-link-active-background-color: @thirth-color;
@navigation-link-active-color: #fff;

/* Dropdown */
@navigation-dropdown-background-color: @thirth-color;
@navigation-dropdown-link-background-color: @thirth-color;
@navigation-dropdown-link-color: #fff;
@navigation-dropdown-link-hover-background-color: #fff;
@navigation-dropdown-link-hover-color: @thirth-color;
@navigation-dropdown-html-content-border: 0px solid #ededed;

/* Badge */
@badge-background-color: @secondary-color;
@badge-text-color: @thirth-color;

/* Label (component) */
@label-background-color: #ededed;
@label-text-color: @primary-color;

/* Tabs */
@tab-background-color: transparent;
@tab-text-color: @secondary-color;
@tab-border: 1px solid transparent;
@tab-hover-background-color: #FDFDFD;
@tab-hover-text-color: #000;
@tab-hover-border: 1px solid #ddd;
@tab-active-background-color: transparent;
@tab-active-text-color: #000;
@tab-active-border: 1px solid #ddd;

/* Collapse (accordion) */
@panel-background-color: transparent;
@panel-border: none;
@panel-border-radius: 0;
@panel-box-shadow: none;
@panel-heading-background-color: @thirth-color;
@panel-heading-color: #fff;
@panel-heading-border-color: transparent;
@panel-heading-padding: 10px 15px;
@panel-heading-hover-background-color: #ededed;
@panel-heading-hover-color: #000;
@panel-heading-hover-border-color: transparent;
@panel-heading-active-background-color: #ededed;
@panel-heading-active-color: #000;
@panel-heading-active-border-color: transparent;
@panel-border-radius: 0;

/* Tooltip */
@tooltip-background-color: #333;
@tooltip-border: 1px solid #333;
@tooltip-box-shadow: 0 0 3px #ccc;
@tooltip-color: #fff;
@tooltip-font-size: 11px;
@tooltip-font-weight: 500;
@tooltip-arrow-color: #333;

/* Breadcrumbs */
@breadcrumb-container-background-color: transparent;
@breadcrumb-text-transform: uppercase;
@breadcrumb-link-color: @fourth-color;
@breadcrumb-link-hover-color: @thirth-color;
@breadcrumb-seperator: "\f105"; // Font awesome unicodes only!
@breadcrumb-seperator-color: #b7b7b7;
@breadcrumb-last-link-color: #000; // The current page, has pointer-events: none; on it!

/*Footer styling*/
@footer-background-color: #26262B;
@footer-text-color: #fff;
@footer-extra-content-row-color: #fff;
@footer-social-row-background-color: @thirth-color;
@footer-social-row-text-color: #fff;
@footer-social-row-text-color-hover: @fourth-color;
@footer-content-text-color: #fff;
@footer-content-link-text-color: #337ab7;
@footer-content-link-text-color-hover: @thirth-color;
@footer-copyright-background-color: transparent;
@footer-copyright-text-color: #fff;
@footer-copyright-link-color: #fff;

/* Buttons */
@btn-basic-background-color: @thirth-color;
@btn-basic-text-color: #fff;
@btn-basic-border: 1px solid @thirth-color;
@btn-basic-border-radius: 3px;
@btn-basic-hover-background-color: @thirth-color;
@btn-basic-hover-text-color: #fff;
@btn-basic-hover-border: 1px solid @thirth-color;
@btn-basic-focus-background-color: @thirth-color;
@btn-basic-focus-text-color: #fff;
@btn-basic-focus-border: 1px solid @thirth-color;

@btn-default-background-color: #fff;
@btn-default-text-color: @secondary-color;
@btn-default-border: 1px solid @fifth-color;
@btn-default-border-radius: 3px;
@btn-default-hover-background-color: #fff;
@btn-default-hover-text-color: @secondary-color;
@btn-default-hover-border: 1px solid @fifth-color;
@btn-default-focus-background-color: #fff;
@btn-default-focus-text-color: @secondary-color;
@btn-default-focus-border: 1px solid @fifth-color;

@btn-primary-background-color: @thirth-color;
@btn-primary-text-color: #fff;
@btn-primary-border: 1px solid @thirth-color;
@btn-primary-border-radius: 3px;
@btn-primary-hover-background-color: @thirth-color;
@btn-primary-hover-text-color: #fff;
@btn-primary-hover-border: 1px solid @thirth-color;
@btn-primary-focus-background-color: @thirth-color;
@btn-primary-focus-text-color: #fff;
@btn-primary-focus-border: 1px solid @thirth-color;

@btn-success-background-color: #86B400;
@btn-success-text-color: #fff;
@btn-success-border: 1px solid #86B400;
@btn-success-border-radius: @border-radius;
@btn-success-hover-background-color: #fff;
@btn-success-hover-text-color: @primary-color;
@btn-success-hover-border: 1px solid #86af49;
@btn-success-focus-background-color: #86af49;
@btn-success-focus-text-color: #fff;
@btn-success-focus-border: 1px solid #86af49;

@btn-info-background-color: #034f84;
@btn-info-text-color: #fff;
@btn-info-border: 1px solid #034f84;
@btn-info-border-radius: @border-radius;
@btn-info-hover-background-color: #034f84;
@btn-info-hover-text-color: #fff;
@btn-info-hover-border: 1px solid #034f84;
@btn-info-focus-background-color: #034f84;
@btn-info-focus-text-color: #fff;
@btn-info-focus-border: 1px solid #034f84;

@btn-warning-background-color: #FF6F00;
@btn-warning-text-color: #fff;
@btn-warning-border: 1px solid #FF6F00;
@btn-warning-border-radius: @border-radius;
@btn-warning-hover-background-color: #FF6F00;
@btn-warning-hover-text-color: #fff;
@btn-warning-hover-border: 1px solid #FF6F00;
@btn-warning-focus-background-color: #FF6F00;
@btn-warning-focus-text-color: #fff;
@btn-warning-focus-border: 1px solid #FFA000;

@btn-danger-background-color: #E53935;
@btn-danger-text-color: #fff;
@btn-danger-border: 1px solid #B71C1C;
@btn-danger-border-radius: @border-radius;
@btn-danger-hover-background-color: #E53935;
@btn-danger-hover-text-color: #fff;
@btn-danger-hover-border: 1px solid #B71C1C;
@btn-danger-focus-background-color: #E53935;
@btn-danger-focus-text-color: #fff;
@btn-danger-focus-border: 1px solid #B71C1C;

@btn-link-background-color: transparent;
@btn-link-text-color: @thirth-color;
@btn-link-border: 0;
@btn-link-border-radius: 0;
@btn-link-hover-background-color: transparent;
@btn-link-hover-text-color: @thirth-color;
@btn-link-hover-border: 0;
@btn-link-focus-background-color: transparent;
@btn-link-focus-text-color: @thirth-color;
@btn-link-focus-border: 0;

/* Button icons */
@btn-basic-icon-color: #fff;
@btn-default-icon-color: #3c475c;
@btn-primary-icon-color: #fff;
@btn-success-icon-color: #fff;
@btn-info-icon-color: #fff;
@btn-warning-icon-color: #fff;
@btn-danger-icon-color: #fff;
@btn-link-icon-color: #000;

@danger-btn-color: #darkred;
@danger-btn-radius: 0;

/* Active */
@input-active-background: @primary-color;
@input-active-border: 1px solid @input-active-background;

@modal-header-background-color: #fff;
@modal-body-background-color: #fff;

@success-color: #6AC259;
@warning-color: @secondary-color;
@error-color: #B91D1B;
@info-color: #fff8c9;

/* Animations */
@spin-duration: 1s;

html {
    height: 100%;
}

body {
    background-color: #fff;
    min-height: 100%;
    display: flex;
    flex-direction: column;
    position: relative;
}

html, body {
    font-size: 14px;
}

html, body, * {
    font-family: 'Poppins', sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Make footer stick at the bottom */
main {
    flex: 1 0 auto;
}


.hide-label-delivery {
    display: none;
}

.show-label-delivery {
    display: inline-block;
    margin-left: 5px;
    position: relative;
    top: -26px;
    left: 14px;
    font-weight: 400;
    font-size: 12px;
    color: red;
    border: 1px solid #bce8f1;
    background: #d9edf7;
    padding: 5px 10px;
    border-radius: 5px;
    max-width: 250px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    word-break: break-word;
}

.position-delivery-check {
    position: relative;
  }

.size-tooltip {
    font-size: 18px;
    position: relative;
    top: 2px;
}
/*
    Solvisoft components stylesheets

    BETA

    @author Richard Mauritz
    @since  21-08-2018
*/

// Components can also be initialized with a class
div[class*="component"] {
    display: block;
}

/* Active filters component */
active-filters-component {
    display: block;
    margin-bottom: 15px;

    span {
        margin-right: 5px;
    }

    span.active-filter {
        background-color: @fifth-color;
        position: relative;
        display: inline-block;
        border-radius: 12px;
        border: 1px solid @secondary-color;
        padding: 0px 25px 2px 10px;
        top: -1px;

        // Icon
        i {
            position: absolute;
            top: 4px;right: 5px;
            cursor: pointer;

            .transition(.12s);

            &:hover {
                opacity: .7;

                .transition(.12s);
            }
        }
    }
}

/* Webshop filters component */
webshop-filters-component {
    display: block;

    ul, li {
        display: block;
        margin: 0;
        padding: 0;
    }

    ul {
        > span {
            position: relative;
            display: block;
            padding: 10px;
            font-weight: bold;

            .transition(.12s);

            &::after {
                right: 15px;
                top: 10px;

                .font-awesome("\f0d8");
            }

            &:hover {
                cursor: pointer;
            }

            &.collapsed {
                &::after {
                    right: 15px;
                    top: 10px;

                    .font-awesome("\f0d7");
                }
            }
        }

        > ul > li {
            padding: 10px;

            > label {
                display: block;
                font-weight: normal;
                margin-bottom: 0;
                padding-left: 10px;
                padding-right: 15px;
                cursor: pointer;

                > label {
                    position: absolute !important;
                    top: 13px;
                    right: 10px;
                    cursor: pointer;
                }
            }
        }
    }
}
/*
    Dialog polyfill stylesheet

    @package    Solvisoft
    @author     Google Inc.
    @link       https://github.com/GoogleChrome/dialog-polyfill/blob/master/dialog-polyfill.css
*/

@import "/content/Default/LESS/dialog.less";
/*
    Global stylesheet for form elements

    @package Solvisoft
    @author Richard Mauritz
    @since 31-10-2017
*/

@import "/content/Default/LESS/forms.less";
/*
	Google maps stylesheet.
	Give the google map a custom layout here

	Layout is also used for the [google-maps] directive

	@package Solvisoft
	@author	Richard Mauritz
	@since 12-12-2017
    @editor Jeroen de Jager
    @Comment: This is a custom height for theme_1
*/

google-maps {
	display: block;
	min-height: 350px;

	img {
		max-width: none !important;
	    max-height: none !important;
	}
}
/*
    Hover css stylesheet
    Overwrite all hover classes, defined inside hover.css, from Daneden.

    @package Solvisoft
    @author Richard Mauritz
    @since 04-10-2017
*/

@import "/content/Default/LESS/hover.css.less";
/*
    Default HTML and HTML5 elements, eg. <audio> <article> etc...

    @package Solvisoft
    @author Richard Mauritz
    @since 28-11-2017
*/

/*
    HTML elements
*/

@import "/content/Default/LESS/HTML-elements.less";
/*
    Includes.inc.less
    Include all stylesheets here
    
    @package Solvisoft
    @author Richard Mauritz
*/
@import "/content/Default/LESS/loaders.less";
/*
    Pagination stylesheet.
    
    @author     Richard Mauritz
    @package    Solvisoft
*/

@import "/content/Default/LESS/pagination.less";
/*
    PDF viewer stylesheet

    @package Solvisoft
    @author Richard Mauritz
    @since 10-04-2018
*/

@import "/content/Default/LESS/pdf.less";

/* Popup defaults */
@import "/content/Default/LESS/popups.less";
/*
    Recently viewed items stylesheet
    Selector can also be [ng-recently-viewed]

    @package Solvisoft
    @author Richard Mauritz
*/

.recently-viewed-items .item-block {
    background: #fff;
}

.recently-viewed-items .item-block h3 {
    margin: 0;
}

.recently-viewed-items .item-block .btn-default {
    background: @thirth-color;
    border-color: @thirth-color;
    color: #fff;
    display: block;
    padding: 5px;
    width: 100%;
    font-size: 18px;
    margin-top: 10px;

    .box-shadow(1px 1px 3px #ccc);
}

.recently-viewed-items .item-block .btn-default:hover {
    opacity: .8;
}

@import "/content/Default/LESS/tables.less";
/*
    Toaster stylesheet

    @package    Toaster
    @author     Richard Mauritz
*/

@import "/content/Default/LESS/toaster.less";
/*
    Bootstrap alert boxes stylesheet

    @package Solvisoft
    @author Richard Mauritz
    @since 17-01-2017
*/

@import "/content/Default/LESS/Bootstrap/boostrap.alerts.less";
/*
    Bootstrap badges layout

    @package Solvisoft
    @author Richard Mauritz
    @since 16-01-2016
*/

@import "/content/Default/LESS/Bootstrap/bootstrap.badge.less";
/*
    Bootstrap badges layout

    @package Solvisoft
    @author Richard Mauritz
    @since 16-01-2016
*/

@import "/content/Default/LESS/Bootstrap/bootstrap.label.less";
/*
    Bootstrap modal stylesheet

    @package Solvisoft
    @author Richard Mauritz
*/

@import "/content/Default/LESS/Bootstrap/bootstrap.modal.less";
/*
    Bootstrap popover

    @package Solvisoft
    @author Richard Mauritz
    @since 24-10-2017
*/

@import "/content/Default/LESS/Bootstrap/bootstrap.popover.less";
/*
    Bootstrap tab stylesheet

    @package Solvisoft
    @author Richard Mauritz
*/

@import "/content/Default/LESS/Bootstrap/bootstrap.tabs.less";
/*
	Bootstrap tooltip stylesheet
	
	@package Solvisoft
	@author	Richard Mauritz
	@since 04-10-2017
*/

@import "/content/Default/LESS/Bootstrap/bootstrap.tooltip.less";
/*
    Bootstrap accordion (panel) stylesheet

    @package Solvisoft
    @author Richard Mauritz
    @Editor Jeroen de Jager
    @Comment: This file is needed for the FAQ page of BSAutoparts, don't delete it
*/

.panel {
    background-color: transparent;
    margin-bottom: 15px;
}

.panel-default {
    border: 0;

    .box-shadow(none);
}

.panel-default > .panel-heading {
    padding: 12px;
    color: #fff;
    border-radius: 5px;
}

.panel-default > .panel-heading {
    position: relative;
    background: @dark-gray-color;

    &:after {
        top: 11px;
        right: 15px;

        .font-awesome("\f068");
    }

    .hoverFade(.33s);
}

.panel-default > .panel-heading:hover {
    cursor: pointer;
}

.panel-default > .panel-heading.collapsed {
    background: @light-gray-color;
    color: @secondary-color;

    &:after {
        top: 11px;
        right: 15px;

        .font-awesome("\f067");
    }

    .hoverFade(.33s);
}

.panel-default > .panel-heading + .panel-collapse > .panel-body {
    background-color: transparent;
    border-top: 0;
}

/*      Custom CSS for FAQ accordion BS     */
.panel-default > .panel-heading {
    background: @thirth-color;
    color: #fff;
}

.panel-default > .panel-heading.collapsed {
    background: @light-gray-color;
    color: @secondary-color;

}


/*
    Bootstrap carousel styles

    @package Solvisoft
    @author Richard Mauritz
*/

#homeSlider .carousel-inner,
#PageArticleSlider .carousel-inner {
    position: relative;
    max-height: 500px;
    min-height: 250px;
}

#homeSlider .small-carousel-inner,
#PageArticleSlider .small-carousel-inner {
    max-height: 350px;
}

#homeSlider .carousel-inner:after,
#PageArticleSlider .carousel-inner:after {
    background-image: url('../BSAutopartsTheme/Images/x80-grunge-B&S-white.png');
//    background-color: rgba(0, 0, 0, .1);
    background-repeat: repeat no-repeat;
    background-position: bottom;
    position: absolute;
    content: "";
    bottom: 0;
    left: 0;
    height: 50px;
    width: 100%;
    z-index: 10;
}

#homeSlider .carousel-caption,
#PageArticleSlider .carousel-caption {
    top: 60px;
}

.carousel-indicators,
.carousel-control {
    z-index: 22;
}

.carousel-indicators li {
    background: #fff;
}

.carousel-indicators .active {
    background: @thirth-color;
    border: none;
}

.carousel-control {
    z-index: 9999;
}

.carousel-caption {
    text-align: left;
    width: 100%;
    left: 0;
    top: 60px;
    bottom: auto;
    z-index: 20;
}

.carousel-caption .carousel-caption-inner {
    max-width: 1170px;
    margin: 0 auto;
    padding: 15px;
}

.carousel-caption .carousel-caption-inner h1 {
    font-weight: bold;
}

.carousel-caption .carousel-caption-inner p {
    color: lighten(@primary-color, 70%);
    font-size: 16px;
}

@media (max-width: 860px) {
    #homeSlider .carousel-caption,
    #PageArticleSlider .carousel-caption {
        top: 10px;

        h1 {
            font-size: 18px;
        }
    }
}

@media (max-width: 696px) {
    #homeSlider .carousel-inner,
    #PageArticleSlider .carousel-inner {
        min-height: 100px;
    }

    #homeSlider .carousel-caption,
    #PageArticleSlider .carousel-caption {
        top: 0;
    }

    .carousel-caption .carousel-caption-inner h1 {
        font-size: 26px;
        margin-top: 0;
    }
}
/*
    Extend bootstrap with more functionality

    @author     none
    @package    Solvisoft
*/

/* Col class adding padding to top and bottom */
.col {
    padding: 15px;
}

.text-left-not-xs, .text-left-not-sm, .text-left-not-md, .text-left-not-lg {
    text-align: left;
}
.text-center-not-xs, .text-center-not-sm, .text-center-not-md, .text-center-not-lg {
    text-align: center;
}
.text-right-not-xs, .text-right-not-sm, .text-right-not-md, .text-right-not-lg {
    text-align: right;
}
.text-justify-not-xs, .text-justify-not-sm, .text-justify-not-md, .text-justify-not-lg {
    text-align: justify;
}

@media (max-width: 767px) {
    .text-left-not-xs, .text-center-not-xs, .text-right-not-xs, .text-justify-not-xs {
        text-align: inherit;
    }
    .text-left-xs {
        text-align: left;
    }
    .text-center-xs {
        text-align: center;
    }
    .text-right-xs {
        text-align: right;
    }
    .text-justify-xs {
        text-align: justify;
    }
}
@media (min-width: 768px) and (max-width: 991px) {
    .text-left-not-sm, .text-center-not-sm, .text-right-not-sm, .text-justify-not-sm {
        text-align: inherit;
    }
    .text-left-sm {
        text-align: left;
    }
    .text-center-sm {
        text-align: center;
    }
    .text-right-sm {
        text-align: right;
    }
    .text-justify-sm {
        text-align: justify;
    }
}
@media (min-width: 992px) and (max-width: 1199px) {
    .text-left-not-md, .text-center-not-md, .text-right-not-md, .text-justify-not-md {
        text-align: inherit;
    }
    .text-left-md {
        text-align: left;
    }
    .text-center-md {
        text-align: center;
    }
    .text-right-md {
        text-align: right;
    }
    .text-justify-md {
        text-align: justify;
    }
}
@media (min-width: 1200px) {
    .text-left-not-lg, .text-center-not-lg, .text-right-not-lg, .text-justify-not-lg {
        text-align: inherit;
    }
    .text-left-lg {
        text-align: left;
    }
    .text-center-lg {
        text-align: center;
    }
    .text-right-lg {
        text-align: right;
    }
    .text-justify-lg {
        text-align: justify;
    }
}

.col-xxs-1, .col-xxs-2, .col-xxs-3, .col-xxs-4,
.col-xxs-5, .col-xxs-6, .col-xxs-7, .col-xxs-8,
.col-xxs-9, .col-xxs-10, .col-xxs-11, .col-xxs-12 {
    min-height: 1px;
    padding-left: 15px;
    padding-right: 15px;
    position: relative;
}

@media (max-width: 576px) {
    .col-xxs-1,
    .col-xxs-2,
    .col-xxs-3,
    .col-xxs-4,
    .col-xxs-5,
    .col-xxs-6,
    .col-xxs-7,
    .col-xxs-8,
    .col-xxs-9,
    .col-xxs-10,
    .col-xxs-11 {
        float: left;
    }

    .col-xxs-1 {
        width: 8.333333333333332%;
    }

    .col-xxs-2 {
        width: 16.666666666666664%;
    }

    .col-xxs-3 {
        width: 25%;
    }

    .col-xxs-4 {
        width: 33.33333333333333%;
    }

    .col-xxs-5 {
        width: 41.66666666666667%;
    }

    .col-xxs-6 {
        width: 50%;
    }

    .col-xxs-7 {
        width: 58.333333333333336%;
    }

    .col-xxs-8 {
        width: 66.66666666666666%;
    }

    .col-xxs-9 {
        width: 75%;
    }

    .col-xxs-10 {
        width: 83.33333333333334%;
    }

    .col-xxs-11 {
        width: 91.66666666666666%;
    }

    .col-xxs-12 {
        width: 100%;
    }

    .col-xxs-push-1 {
        left: 8.333333333333332%;
    }

    .col-xxs-push-2 {
        left: 16.666666666666664%;
    }

    .col-xxs-push-3 {
        left: 25%;
    }

    .col-xss-push-4 {
        left: 33.33333333333333%;
    }

    .col-xxs-push-5 {
        left: 41.66666666666667%;
    }

    .col-xxs-push-6 {
        left: 50%;
    }

    .col-xxs-push-7 {
        left: 58.333333333333336%;
    }

    .col-xxs-push-8 {
        left: 66.66666666666666%;
    }

    .col-xxs-push-9 {
        left: 75%;
    }

    .col-xxs-push-10 {
       left: 83.33333333333334%;
    }

    .col-xxs-push-11 {
       left: 91.66666666666666%;
    }

    .col-xxs-pull-1 {
        right: 8.333333333333332%;
    }

    .col-xxs-pull-2 {
        right: 16.666666666666664%;
    }

    .col-xxs-pull-3 {
        right: 25%;
    }

    .col-xxs-pull-4 {
        right: 33.33333333333333%;
    }

    .col-xxs-pull-5 {
        right: 41.66666666666667%;
    }

    .col-xxs-pull-6 {
        right: 50%;
    }

    .col-xxs-pull-7 {
        right: 58.333333333333336%;
    }

    .col-xxs-pull-8 {
        right: 66.66666666666666%;
    }

    .col-xxs-pull-9 {
        right: 75%;
    }

    .col-xxs-pull-10 {
        right: 83.33333333333334%;
    }

    .col-xxs-pull-11 {
        right: 91.66666666666666%;
    }

    .col-xxs-offset-1 {
        margin-left: 8.333333333333332%;
    }

    .col-xxs-offset-2 {
        margin-left: 16.666666666666664%;
    }

    .col-xxs-offset-3 {
        margin-left: 25%;
    }

    .col-xxs-offset-4 {
        margin-left: 33.33333333333333%;
    }

    .col-xxs-offset-5 {
        margin-left: 41.66666666666667%;
    }

    .col-xxs-offset-6 {
        margin-left: 50%;
    }

    .col-xxs-offset-7 {
        margin-left: 58.333333333333336%;
    }

    .col-xxs-offset-8 {
        margin-left: 66.66666666666666%;
    }

    .col-xxs-offset-9 {
        margin-left: 75%;
    }

    .col-xxs-offset-10 {
        margin-left: 83.33333333333334%;
    }

    .col-xxs-offset-11 {
        margin-left: 91.66666666666666%;
    }
}   

tr.hidden-xxs {
    display: table-row !important;
}

th.hidden-xxs,
td.hidden-xxs {
    display: table-cell !important;
}

@media (max-width: 576px) {

    .hidden-xxs {
        display: none !important;
    }

    tr.hidden-xxs {
        display: none !important;
    }

    th.hidden-xxs,
    td.hidden-xxs {
        display: none !important;
    }

}

@media (min-width: 385px) and (max-width: 767px) {

    .hidden-xxs.hidden-xs {
        display: none !important;
    }

    tr.hidden-xxs.hidden-xs {
        display: none !important;
    }

    th.hidden-xxs.hidden-xs,
    td.hidden-xxs.hidden-xs {
        display: none !important;
    }

}

@media (min-width: 768px) and (max-width: 991px) {

    .hidden-xxs.hidden-sm {
        display: none !important;
    }

    tr.hidden-xxs.hidden-sm {
        display: none !important;
    }

    th.hidden-xxs.hidden-sm,
    td.hidden-xxs.hidden-sm {
        display: none !important;
    }

}

@media (min-width: 992px) and (max-width: 1199px) {

    .hidden-xxs.hidden-md {
        display: none !important;
    }

    tr.hidden-xxs.hidden-md {
        display: none !important;
    }

    th.hidden-xxs.hidden-md,
    td.hidden-xxs.hidden-md {
        display: none !important;
    }

}

@media (min-width: 1200px) {

    .hidden-xxs.hidden-lg {
        display: none !important;
    }

    tr.hidden-xxs.hidden-lg {
        display: none !important;
    }

    th.hidden-xxs.hidden-lg,
    td.hidden-xxs.hidden-lg {
        display: none !important;
    }

}

@media (max-width: 576px) {

    .hidden-xs.hidden-xxs {
        display: none !important;
    }

    tr.hidden-xs.hidden-xxs {
        display: none !important;
    }

    th.hidden-xs.hidden-xxs,
    td.hidden-xs.hidden-xxs {
        display: none !important;
    }

}

@media (max-width: 576px) {

    .hidden-sm.hidden-xxs {
        display: none !important;
    }

    tr.hidden-sm.hidden-xxs {
        display: none !important;
    }

    th.hidden-sm.hidden-xxs,
    td.hidden-sm.hidden-xxs {
        display: none !important;
    }

}

@media (max-width: 576px) {

    .hidden-md.hidden-xxs {
        display: none !important;
    }

    tr.hidden-md.hidden-xxs {
        display: none !important;
    }

    th.hidden-md.hidden-xxs,
    td.hidden-md.hidden-xxs {
        display: none !important;
    }

}

@media (max-width: 576px) {

    .hidden-lg.hidden-xxs {
        display: none !important;
    }

    tr.hidden-lg.hidden-xxs {
        display: none !important;
    }

    th.hidden-lg.hidden-xxs,
    td.hidden-lg.hidden-xxs {
        display: none !important;
    }
} 
/*
    Stylesheets for inputs

    @package Solvisoft
    @author Richard Mauritz
*/

.form-control,
.form-control,
.form-control {
    padding: 10px;
    height: auto;
    border-radius: 5px;
}

.form-control,
.form-control:hover,
.form-control:focus {
    .box-shadow(none);
    font-size: 14px;
}

.form-control:hover,
.form-control:focus {
    border-color: @thirth-color;
}


.input-group-btn .btn {
    padding: 10px 15px;
}

/*
    Buttons
*/
.btn {
    background-color: @btn-basic-background-color;
    border: @btn-basic-border;
    border-radius: @btn-basic-border-radius;
    color: @btn-basic-text-color;
    // For hover effect
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px transparent;
    position: relative;
    -webkit-transition-property: color;
    transition-property: color;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    overflow: hidden;
    outline: none;
    height: auto;
    padding: 10px;

    .transition(.33s);

     &:hover, &:active:hover, &.active:hover, &.disabled:hover, &:disabled:hover {
        background-color: @btn-basic-hover-background-color;
        border: @btn-basic-hover-border;
        color: @btn-basic-hover-text-color;
        text-decoration: none;

        .transition(.33s);

        &:before {
            -webkit-transform: scaleX(1);
            transform: scaleX(1);
        }
    }

    &:active, &.active, &:focus, &:active:focus, &.active:focus, &.disabled:focus, &:disabled:focus  {
        background-color: @btn-basic-hover-background-color;
        border: @btn-basic-hover-border;
        color: @btn-basic-hover-text-color;
        outline: none;

        .box-shadow(none);
    }

    &:before {
        content: "";
        position: absolute;
        z-index: -1;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        border-radius: @border-radius;
        -webkit-transform: scaleX(0);
        transform: scaleX(0);
        -webkit-transform-origin: 0 50%;
        transform-origin: 0 50%;
        -webkit-transition-property: transform;
        transition-property: transform;
        -webkit-transition-duration: 0.3s;
        transition-duration: 0.3s;
        -webkit-transition-timing-function: ease-out;
        transition-timing-function: ease-out;
    }

    &:before {
        background: darken(@btn-basic-hover-background-color, 5%);
    }

    // Fix icons if they exist
    .fa:not(.fa-fw) {
        margin-top: -3px;
        padding-left: 10px;
        padding-right: 10px;
    }

    .fa, &::after {
        color: @btn-basic-icon-color;
    }

    // Buttons sizes
    &.btn-xs {
        padding: 5px;
    }

    &.btn-sm {
        padding: 8px;
    }

    &.btn-md {
        padding: 10px
    }

    &.btn-lg {
        padding: 15px;
    }
}

.btn-default {
    background: @btn-default-background-color;
    border: @btn-default-border;
    border-radius: @btn-default-border-radius;
    color: @btn-default-text-color;

    .fa {
        color: @btn-default-icon-color;
    }

    &:hover, &:active:hover, &.active:hover, &.disabled:hover, &:disabled:hover {
        background-color: @btn-default-hover-background-color;
        border: @btn-default-hover-border;
        color: @btn-default-hover-text-color;
    }

    &:focus, &:active:focus, &.active:focus, &.disabled:focus, &:disabled:focus {
        background-color: @btn-default-focus-background-color;
        border: @btn-default-focus-border;
        color: @btn-default-focus-text-color;
    }

    &:before {
        background: darken(@btn-default-hover-background-color, 5%);
    }
}

.btn-primary {
    background: @btn-primary-background-color;
    border: @btn-primary-border;
    border-radius: @btn-primary-border-radius;
    color: @btn-primary-text-color;

    .fa {
        color: @btn-primary-icon-color;
    }

    &:hover, &:active:hover, &.active:hover, &.disabled:hover, &:disabled:hover {
        background-color: @btn-primary-hover-background-color;
        border: @btn-primary-hover-border;
        color: @btn-primary-hover-text-color;
    }

    &:focus, &:active:focus, &.active:focus, &.disabled:focus, &:disabled:focus {
        background-color: @btn-primary-hover-background-color;
        border: @btn-primary-hover-border;
        color: @btn-primary-hover-text-color;
    }

    &:before {
        background: darken(@btn-primary-hover-background-color, 5%);
    }
}

.btn-success {
    background: @btn-success-background-color;
    border: @btn-success-border;
    border-radius: @btn-success-border-radius;
    color: @btn-success-text-color;
    padding-right: 30px;

    .fa {
        color: @btn-success-icon-color;
    }
   
    &:hover, &:active:hover, &.active:hover, &.disabled:hover, &:disabled:hover {
        background-color: @btn-success-hover-background-color;
        border: @btn-success-hover-border;
        color: @btn-success-hover-text-color;
    }

    &:focus, &:active:focus, &.active:focus, &.disabled:focus, &:disabled:focus {
        background-color: @btn-success-hover-background-color;
        border: @btn-success-hover-border;
        color: @btn-success-hover-text-color;
    }

    &:after {
       right: 10px;

       .font-awesome("\f14a");
    }

    &:before {
        background: darken(@btn-success-hover-background-color, 5%);
    }
}

.btn-info {
    background-color: @btn-info-background-color;
    border: @btn-info-border;
    border-radius: @btn-info-border-radius;
    color: @btn-info-text-color;
    padding-right: 30px;

    .fa {
        color: @btn-info-icon-color;
    }

    &:hover, &:active:hover, &.active:hover, &.disabled:hover, &:disabled:hover {
        background-color: @btn-info-hover-background-color;
        border: @btn-info-hover-border;
        color: @btn-info-hover-text-color;
    }

    &:focus, &:active:focus, &.active:focus, &.disabled:focus, &:disabled:focus {
        background-color: @btn-info-hover-background-color;
        border: @btn-info-hover-border;
        color: @btn-info-hover-text-color;
    }

     &:after {
       right: 10px;

       .font-awesome("\f059");
     }

    &:before {
        background: darken(@btn-info-hover-background-color, 5%);
    }
}

.btn-warning {
    background-color: @btn-warning-background-color;
    border: @btn-warning-border;
    border-radius: @btn-warning-border-radius;
    color: @btn-warning-text-color;
    padding-right: 30px;

    .fa {
        color: @btn-warning-icon-color;
    }

   &:hover, &:active:hover, &.active:hover, &.disabled:hover, &:disabled:hover {
        background-color: @btn-warning-hover-background-color;
        border: @btn-warning-hover-border;
        color: @btn-warning-hover-text-color;
    }

    &:focus, &:active:focus, &.active:focus, &.disabled:focus, &:disabled:focus {
        background-color: @btn-warning-hover-background-color;
        border: @btn-warning-hover-border;
        color: @btn-warning-hover-text-color;
    }

    &:after {
        right: 10px;

        .font-awesome("\f071");
    }

    &:before {
        background: darken(@btn-warning-hover-background-color, 5%);
    }
}

.btn-danger {
    background-color: @btn-danger-background-color;
    border: @btn-danger-border;
    border-radius: @btn-danger-border-radius;
    color: @btn-danger-text-color;
    padding-right: 30px;

    .fa {
        color: @btn-danger-icon-color;
    }

    &:hover, &:active:hover, &.active:hover, &.disabled:hover, &:disabled:hover {
        background-color: @btn-danger-hover-background-color;
        border: @btn-danger-hover-border;
        color: @btn-danger-hover-text-color;
    }

    &:focus, &:active:focus, &.active:focus, &.disabled:focus, &:disabled:focus {
        background-color: @btn-danger-hover-background-color;
        border: @btn-danger-hover-border;
        color: @btn-danger-hover-text-color;
    }

    &:after {
       right: 10px;

       .font-awesome("\f1f8");
    }

    &:before {
        background: darken(@btn-danger-hover-background-color, 5%);
    }
}

.btn-link {
    position: relative;
    padding-left: 2px;
    background-color: @btn-link-background-color;
    border: @btn-link-border;
    border-radius: @btn-link-border-radius;
    color: @btn-link-text-color;
    text-align: left;
    overflow: visible;

    &:hover, &:active:hover, &.active:hover, &.disabled:hover, &:disabled:hover {
        background-color: @btn-link-hover-background-color;
        border: @btn-link-hover-border;
        color: @btn-link-hover-text-color;
        text-decoration: none;
    }

    &:focus, &:active:focus, &.active:focus, &.disabled:focus, &:disabled:focus {
        background-color: @btn-link-focus-background-color;
        border: @btn-link-focus-border;
        color: @btn-link-focus-text-color;
    }

    &::after {
        position: absolute;
        content: " ";
        background-color: @thirth-color;
        width: 110%;
        height: 2px;
        bottom: 0;
        left: 0;

        .transition(width .33s ease-in-out);
    }

    &:before {
        background: transparent;
    }

    &:hover::after {
        width: 120%;
        background-color: @btn-link-hover-text-color;

        .transition(width .33s ease-in-out);
    }
}

.btn-delete {
    background-color: #fdfdfd;
    border-radius: @border-radius;
    border: none;
    outline: none;
}

.btn-favorite {
    .fa {
        position: relative;
        top: -2px;
    }
}

.btn-lg, .btn-group-lg > .btn {
    font-size: 14px;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 80px;
    padding-right: 80px;
}

/*
	Bootstrap navbars stylesheet

	@package Solvisoft
	@author	Richard Mauritz
	@since 01-11-2017
*/

.navbar-fixed-bottom {

	.close {
		padding: 15px;
		outline: none;
		font-size: 44px;

		.transition(.33s);

		&:hover {

			.transition(.33s);
		}
	}

	.box-shadow(0 0 3px -1px #ccc);
}

.nav.navbar-nav {
    margin: 0;

    > li {

        > a {
            background-color: @navigation-link-background-color;
            color: @navigation-link-color;
            border-radius: @border-radius;

            &.has-dropdown {
                padding-right: 35px;

                &::after {
                    right: 15px;

                    .font-awesome("\f107")
                }
            }
        }
        
        &:hover > a {
            background-color: @navigation-link-hover-background-color;
            color: @navigation-link-hover-color;
        }

        &:focus > a {
            background-color: @navigation-link-focus-background-color;
            color: @navigation-link-focus-color;
        }

        &:active > a, 
        &.active > a,
        &.isActive > a {
            background-color: @navigation-link-active-background-color;
            color: @navigation-link-active-color;
        }

        > .dropdown {
            display: none;
            background-color: @primary-color;
            border-top: 1px solid @thirth-color;
            position: absolute;
            z-index: 200;
            min-width: 200px;

            li, a {
                display: block;
                margin: 0;
                padding: 0;
                float: none;
            }

            > li {
                > a {
                    padding: 10px;
                }
            }

            .box-shadow(1px 1px 3px -1px #ccc);
        }

        &:hover {
            > .dropdown {
                display: block;
            }
        }
    }

    dropdown-menu {
        display: none;
    }

    dropdown-menu {
        background-color: @navigation-dropdown-background-color;
        position: absolute;
        margin-top: -3px;
        border-bottom-left-radius: @border-radius;
        border-bottom-right-radius: @border-radius;
        border-top-right-radius: @border-radius;
        overflow: hidden;
        opacity: 1;

        .box-shadow(1px 1px 3px -1px #ccc);

        dropdown-html {
            display: none;
            min-width: 700px;
            opacity: 1;
        }

        > ul {
            display: block;
            padding: 10px;
            margin: 0;
            min-width: 250px;
            border-right: @navigation-dropdown-html-content-border;

            > li,
            > li > a {
                display: block;
            }

            > li > a {
                background-color: @navigation-dropdown-link-background-color;
                color: @navigation-dropdown-link-color;
            }

            > li {
                padding-right: 0;

                &:hover,
                &.active {
                    > a {
                        background-color: @navigation-dropdown-link-hover-background-color;
                        color: @navigation-dropdown-link-hover-color;
                        border-radius: @border-radius;
                        text-decoration: none;
                    }
                }
            }

            > li > a {
                padding: 10px;

                &.has-content-menu {
                    &::after {
                        right: 15px;

                        .font-awesome("\f105")
                    }
                }
            }
        }
    }

    > li:hover {
        dropdown-menu {
            display: flex;
            z-index:25;

            .animation(fade, .12s, forwards)
        }
    }
}
/*
    Bootstrap pagination stylesheet

    @package Solvisoft
    @author Richard Mauritz
*/

#paging {
    border-top: 1px solid #ccc;
}

.pagination > li:first-child > a,
.pagination > li:first-child > span,
.pagination > li:last-child > a,
.pagination > li:last-child > span {
    border-radius: 3px;
}

.pagination > li > a,
.pagination > li > span {
    border: 1px solid #ccc;
    border-radius: 3px;
    margin-right: -1px;
}

.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
    background-color: @thirth-color;
    cursor: pointer;
    color: #fff;
    border-radius: 3px !important;
}

.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
    background-color: @thirth-color;
    color: #fff !important;
    cursor: pointer;
    border-radius: 3px;
}

/*
    Bootstrap alert boxes stylesheet

    @package Solvisoft
    @author Richard Mauritz
    @since 15-05-2018
*/

@import "/content/Default/LESS/Bootstrap/UI/bootstrap.ui.datepicker.less";
.animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.animated.infinite{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}.animated.hinge{-webkit-animation-duration:2s;animation-duration:2s}.animated.bounceIn,.animated.bounceOut,.animated.flipOutX,.animated.flipOutY{-webkit-animation-duration:.75s;animation-duration:.75s}@-webkit-keyframes bounce{0%,100%,20%,53%,80%{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1);-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}40%,43%{-webkit-animation-timing-function:cubic-bezier(0.755,.050,.855,.060);animation-timing-function:cubic-bezier(0.755,.050,.855,.060);-webkit-transform:translate3d(0,-30px,0);transform:translate3d(0,-30px,0)}70%{-webkit-animation-timing-function:cubic-bezier(0.755,.050,.855,.060);animation-timing-function:cubic-bezier(0.755,.050,.855,.060);-webkit-transform:translate3d(0,-15px,0);transform:translate3d(0,-15px,0)}90%{-webkit-transform:translate3d(0,-4px,0);transform:translate3d(0,-4px,0)}}@keyframes bounce{0%,100%,20%,53%,80%{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1);-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}40%,43%{-webkit-animation-timing-function:cubic-bezier(0.755,.050,.855,.060);animation-timing-function:cubic-bezier(0.755,.050,.855,.060);-webkit-transform:translate3d(0,-30px,0);transform:translate3d(0,-30px,0)}70%{-webkit-animation-timing-function:cubic-bezier(0.755,.050,.855,.060);animation-timing-function:cubic-bezier(0.755,.050,.855,.060);-webkit-transform:translate3d(0,-15px,0);transform:translate3d(0,-15px,0)}90%{-webkit-transform:translate3d(0,-4px,0);transform:translate3d(0,-4px,0)}}.bounce{-webkit-animation-name:bounce;animation-name:bounce;-webkit-transform-origin:center bottom;transform-origin:center bottom}@-webkit-keyframes flash{0%,100%,50%{opacity:1}25%,75%{opacity:0}}@keyframes flash{0%,100%,50%{opacity:1}25%,75%{opacity:0}}.flash{-webkit-animation-name:flash;animation-name:flash}@-webkit-keyframes pulse{0%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}50%{-webkit-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes pulse{0%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}50%{-webkit-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}.pulse{-webkit-animation-name:pulse;animation-name:pulse}@-webkit-keyframes rubberBand{0%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(0.75,1.25,1);transform:scale3d(0.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes rubberBand{0%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(0.75,1.25,1);transform:scale3d(0.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}.rubberBand{-webkit-animation-name:rubberBand;animation-name:rubberBand}@-webkit-keyframes shake{0%,100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}20%,40%,60%,80%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}}@keyframes shake{0%,100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}20%,40%,60%,80%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}}.shake{-webkit-animation-name:shake;animation-name:shake}@-webkit-keyframes swing{20%{-webkit-transform:rotate3d(0,0,1,15deg);transform:rotate3d(0,0,1,15deg)}40%{-webkit-transform:rotate3d(0,0,1,-10deg);transform:rotate3d(0,0,1,-10deg)}60%{-webkit-transform:rotate3d(0,0,1,5deg);transform:rotate3d(0,0,1,5deg)}80%{-webkit-transform:rotate3d(0,0,1,-5deg);transform:rotate3d(0,0,1,-5deg)}100%{-webkit-transform:rotate3d(0,0,1,0deg);transform:rotate3d(0,0,1,0deg)}}@keyframes swing{20%{-webkit-transform:rotate3d(0,0,1,15deg);transform:rotate3d(0,0,1,15deg)}40%{-webkit-transform:rotate3d(0,0,1,-10deg);transform:rotate3d(0,0,1,-10deg)}60%{-webkit-transform:rotate3d(0,0,1,5deg);transform:rotate3d(0,0,1,5deg)}80%{-webkit-transform:rotate3d(0,0,1,-5deg);transform:rotate3d(0,0,1,-5deg)}100%{-webkit-transform:rotate3d(0,0,1,0deg);transform:rotate3d(0,0,1,0deg)}}.swing{-webkit-transform-origin:top center;transform-origin:top center;-webkit-animation-name:swing;animation-name:swing}@-webkit-keyframes tada{0%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}10%,20%{-webkit-transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg);transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg)}30%,50%,70%,90%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg);transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg)}40%,60%,80%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg);transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg)}100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes tada{0%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}10%,20%{-webkit-transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg);transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg)}30%,50%,70%,90%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg);transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg)}40%,60%,80%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg);transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg)}100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}.tada{-webkit-animation-name:tada;animation-name:tada}@-webkit-keyframes wobble{0%{-webkit-transform:none;transform:none}15%{-webkit-transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg);transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg)}30%{-webkit-transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg);transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg)}45%{-webkit-transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg);transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg)}60%{-webkit-transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg);transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg)}75%{-webkit-transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg);transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg)}100%{-webkit-transform:none;transform:none}}@keyframes wobble{0%{-webkit-transform:none;transform:none}15%{-webkit-transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg);transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg)}30%{-webkit-transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg);transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg)}45%{-webkit-transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg);transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg)}60%{-webkit-transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg);transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg)}75%{-webkit-transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg);transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg)}100%{-webkit-transform:none;transform:none}}.wobble{-webkit-animation-name:wobble;animation-name:wobble}@-webkit-keyframes jello{0%,100%,11.1%{-webkit-transform:none;transform:none}22.2%{-webkit-transform:skewX(-12.5deg) skewY(-12.5deg);transform:skewX(-12.5deg) skewY(-12.5deg)}33.3%{-webkit-transform:skewX(6.25deg) skewY(6.25deg);transform:skewX(6.25deg) skewY(6.25deg)}44.4%{-webkit-transform:skewX(-3.125deg) skewY(-3.125deg);transform:skewX(-3.125deg) skewY(-3.125deg)}55.5%{-webkit-transform:skewX(1.5625deg) skewY(1.5625deg);transform:skewX(1.5625deg) skewY(1.5625deg)}66.6%{-webkit-transform:skewX(-.78125deg) skewY(-.78125deg);transform:skewX(-.78125deg) skewY(-.78125deg)}77.7%{-webkit-transform:skewX(0.390625deg) skewY(0.390625deg);transform:skewX(0.390625deg) skewY(0.390625deg)}88.8%{-webkit-transform:skewX(-.1953125deg) skewY(-.1953125deg);transform:skewX(-.1953125deg) skewY(-.1953125deg)}}@keyframes jello{0%,100%,11.1%{-webkit-transform:none;transform:none}22.2%{-webkit-transform:skewX(-12.5deg) skewY(-12.5deg);transform:skewX(-12.5deg) skewY(-12.5deg)}33.3%{-webkit-transform:skewX(6.25deg) skewY(6.25deg);transform:skewX(6.25deg) skewY(6.25deg)}44.4%{-webkit-transform:skewX(-3.125deg) skewY(-3.125deg);transform:skewX(-3.125deg) skewY(-3.125deg)}55.5%{-webkit-transform:skewX(1.5625deg) skewY(1.5625deg);transform:skewX(1.5625deg) skewY(1.5625deg)}66.6%{-webkit-transform:skewX(-.78125deg) skewY(-.78125deg);transform:skewX(-.78125deg) skewY(-.78125deg)}77.7%{-webkit-transform:skewX(0.390625deg) skewY(0.390625deg);transform:skewX(0.390625deg) skewY(0.390625deg)}88.8%{-webkit-transform:skewX(-.1953125deg) skewY(-.1953125deg);transform:skewX(-.1953125deg) skewY(-.1953125deg)}}.jello{-webkit-animation-name:jello;animation-name:jello;-webkit-transform-origin:center;transform-origin:center}@-webkit-keyframes bounceIn{0%,100%,20%,40%,60%,80%{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}20%{-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}40%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}60%{opacity:1;-webkit-transform:scale3d(1.03,1.03,1.03);transform:scale3d(1.03,1.03,1.03)}80%{-webkit-transform:scale3d(.97,.97,.97);transform:scale3d(.97,.97,.97)}100%{opacity:1;-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes bounceIn{0%,100%,20%,40%,60%,80%{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}20%{-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}40%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}60%{opacity:1;-webkit-transform:scale3d(1.03,1.03,1.03);transform:scale3d(1.03,1.03,1.03)}80%{-webkit-transform:scale3d(.97,.97,.97);transform:scale3d(.97,.97,.97)}100%{opacity:1;-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}.bounceIn{-webkit-animation-name:bounceIn;animation-name:bounceIn}@-webkit-keyframes bounceInDown{0%,100%,60%,75%,90%{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,-3000px,0);transform:translate3d(0,-3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,25px,0);transform:translate3d(0,25px,0)}75%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}90%{-webkit-transform:translate3d(0,5px,0);transform:translate3d(0,5px,0)}100%{-webkit-transform:none;transform:none}}@keyframes bounceInDown{0%,100%,60%,75%,90%{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,-3000px,0);transform:translate3d(0,-3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,25px,0);transform:translate3d(0,25px,0)}75%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}90%{-webkit-transform:translate3d(0,5px,0);transform:translate3d(0,5px,0)}100%{-webkit-transform:none;transform:none}}.bounceInDown{-webkit-animation-name:bounceInDown;animation-name:bounceInDown}@-webkit-keyframes bounceInLeft{0%,100%,60%,75%,90%{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(-3000px,0,0);transform:translate3d(-3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(25px,0,0);transform:translate3d(25px,0,0)}75%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}90%{-webkit-transform:translate3d(5px,0,0);transform:translate3d(5px,0,0)}100%{-webkit-transform:none;transform:none}}@keyframes bounceInLeft{0%,100%,60%,75%,90%{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(-3000px,0,0);transform:translate3d(-3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(25px,0,0);transform:translate3d(25px,0,0)}75%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}90%{-webkit-transform:translate3d(5px,0,0);transform:translate3d(5px,0,0)}100%{-webkit-transform:none;transform:none}}.bounceInLeft{-webkit-animation-name:bounceInLeft;animation-name:bounceInLeft}@-webkit-keyframes bounceInRight{0%,100%,60%,75%,90%{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(3000px,0,0);transform:translate3d(3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(-25px,0,0);transform:translate3d(-25px,0,0)}75%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}90%{-webkit-transform:translate3d(-5px,0,0);transform:translate3d(-5px,0,0)}100%{-webkit-transform:none;transform:none}}@keyframes bounceInRight{0%,100%,60%,75%,90%{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(3000px,0,0);transform:translate3d(3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(-25px,0,0);transform:translate3d(-25px,0,0)}75%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}90%{-webkit-transform:translate3d(-5px,0,0);transform:translate3d(-5px,0,0)}100%{-webkit-transform:none;transform:none}}.bounceInRight{-webkit-animation-name:bounceInRight;animation-name:bounceInRight}@-webkit-keyframes bounceInUp{0%,100%,60%,75%,90%{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,3000px,0);transform:translate3d(0,3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}75%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}90%{-webkit-transform:translate3d(0,-5px,0);transform:translate3d(0,-5px,0)}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes bounceInUp{0%,100%,60%,75%,90%{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,3000px,0);transform:translate3d(0,3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}75%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}90%{-webkit-transform:translate3d(0,-5px,0);transform:translate3d(0,-5px,0)}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.bounceInUp{-webkit-animation-name:bounceInUp;animation-name:bounceInUp}@-webkit-keyframes bounceOut{20%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}50%,55%{opacity:1;-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}100%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}}@keyframes bounceOut{20%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}50%,55%{opacity:1;-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}100%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}}.bounceOut{-webkit-animation-name:bounceOut;animation-name:bounceOut}@-webkit-keyframes bounceOutDown{20%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}40%,45%{opacity:1;-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}100%{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}@keyframes bounceOutDown{20%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}40%,45%{opacity:1;-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}100%{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}.bounceOutDown{-webkit-animation-name:bounceOutDown;animation-name:bounceOutDown}@-webkit-keyframes bounceOutLeft{20%{opacity:1;-webkit-transform:translate3d(20px,0,0);transform:translate3d(20px,0,0)}100%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}@keyframes bounceOutLeft{20%{opacity:1;-webkit-transform:translate3d(20px,0,0);transform:translate3d(20px,0,0)}100%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}.bounceOutLeft{-webkit-animation-name:bounceOutLeft;animation-name:bounceOutLeft}@-webkit-keyframes bounceOutRight{20%{opacity:1;-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}100%{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}@keyframes bounceOutRight{20%{opacity:1;-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}100%{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}.bounceOutRight{-webkit-animation-name:bounceOutRight;animation-name:bounceOutRight}@-webkit-keyframes bounceOutUp{20%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}40%,45%{opacity:1;-webkit-transform:translate3d(0,20px,0);transform:translate3d(0,20px,0)}100%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}@keyframes bounceOutUp{20%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}40%,45%{opacity:1;-webkit-transform:translate3d(0,20px,0);transform:translate3d(0,20px,0)}100%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}.bounceOutUp{-webkit-animation-name:bounceOutUp;animation-name:bounceOutUp}@-webkit-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}.fadeIn{-webkit-animation-name:fadeIn;animation-name:fadeIn}@-webkit-keyframes fadeInDown{0%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInDown{0%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}.fadeInDown{-webkit-animation-name:fadeInDown;animation-name:fadeInDown}@-webkit-keyframes fadeInDownBig{0%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInDownBig{0%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}100%{opacity:1;-webkit-transform:none;transform:none}}.fadeInDownBig{-webkit-animation-name:fadeInDownBig;animation-name:fadeInDownBig}@-webkit-keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}.fadeInLeft{-webkit-animation-name:fadeInLeft;animation-name:fadeInLeft}@-webkit-keyframes fadeInLeftBig{0%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInLeftBig{0%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}.fadeInLeftBig{-webkit-animation-name:fadeInLeftBig;animation-name:fadeInLeftBig}@-webkit-keyframes fadeInRight{0%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInRight{0%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}.fadeInRight{-webkit-animation-name:fadeInRight;animation-name:fadeInRight}@-webkit-keyframes fadeInRightBig{0%{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInRightBig{0%{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}.fadeInRightBig{-webkit-animation-name:fadeInRightBig;animation-name:fadeInRightBig}@-webkit-keyframes fadeInUp{0%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInUp{0%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}.fadeInUp{-webkit-animation-name:fadeInUp;animation-name:fadeInUp}@-webkit-keyframes fadeInUpBig{0%{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInUpBig{0%{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}100%{opacity:1;-webkit-transform:none;transform:none}}.fadeInUpBig{-webkit-animation-name:fadeInUpBig;animation-name:fadeInUpBig}@-webkit-keyframes fadeOut{0%{opacity:1}100%{opacity:0}}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.fadeOut{-webkit-animation-name:fadeOut;animation-name:fadeOut}@-webkit-keyframes fadeOutDown{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@keyframes fadeOutDown{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}.fadeOutDown{-webkit-animation-name:fadeOutDown;animation-name:fadeOutDown}@-webkit-keyframes fadeOutDownBig{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}@keyframes fadeOutDownBig{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}.fadeOutDownBig{-webkit-animation-name:fadeOutDownBig;animation-name:fadeOutDownBig}@-webkit-keyframes fadeOutLeft{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@keyframes fadeOutLeft{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}.fadeOutLeft{-webkit-animation-name:fadeOutLeft;animation-name:fadeOutLeft}@-webkit-keyframes fadeOutLeftBig{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}@keyframes fadeOutLeftBig{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}.fadeOutLeftBig{-webkit-animation-name:fadeOutLeftBig;animation-name:fadeOutLeftBig}@-webkit-keyframes fadeOutRight{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}@keyframes fadeOutRight{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}.fadeOutRight{-webkit-animation-name:fadeOutRight;animation-name:fadeOutRight}@-webkit-keyframes fadeOutRightBig{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}@keyframes fadeOutRightBig{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}.fadeOutRightBig{-webkit-animation-name:fadeOutRightBig;animation-name:fadeOutRightBig}@-webkit-keyframes fadeOutUp{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}@keyframes fadeOutUp{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}.fadeOutUp{-webkit-animation-name:fadeOutUp;animation-name:fadeOutUp}@-webkit-keyframes fadeOutUpBig{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}@keyframes fadeOutUpBig{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}.fadeOutUpBig{-webkit-animation-name:fadeOutUpBig;animation-name:fadeOutUpBig}@-webkit-keyframes flip{0%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-360deg);transform:perspective(400px) rotate3d(0,1,0,-360deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) scale3d(.95,.95,.95);transform:perspective(400px) scale3d(.95,.95,.95);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}100%{-webkit-transform:perspective(400px);transform:perspective(400px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}@keyframes flip{0%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-360deg);transform:perspective(400px) rotate3d(0,1,0,-360deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) scale3d(.95,.95,.95);transform:perspective(400px) scale3d(.95,.95,.95);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}100%{-webkit-transform:perspective(400px);transform:perspective(400px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}.animated.flip{-webkit-backface-visibility:visible;backface-visibility:visible;-webkit-animation-name:flip;animation-name:flip}@-webkit-keyframes flipInX{0%{-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotate3d(1,0,0,10deg);transform:perspective(400px) rotate3d(1,0,0,10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-5deg);transform:perspective(400px) rotate3d(1,0,0,-5deg)}100%{-webkit-transform:perspective(400px);transform:perspective(400px)}}@keyframes flipInX{0%{-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotate3d(1,0,0,10deg);transform:perspective(400px) rotate3d(1,0,0,10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-5deg);transform:perspective(400px) rotate3d(1,0,0,-5deg)}100%{-webkit-transform:perspective(400px);transform:perspective(400px)}}.flipInX{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInX;animation-name:flipInX}@-webkit-keyframes flipInY{0%{-webkit-transform:perspective(400px) rotate3d(0,1,0,90deg);transform:perspective(400px) rotate3d(0,1,0,90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-20deg);transform:perspective(400px) rotate3d(0,1,0,-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotate3d(0,1,0,10deg);transform:perspective(400px) rotate3d(0,1,0,10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-5deg);transform:perspective(400px) rotate3d(0,1,0,-5deg)}100%{-webkit-transform:perspective(400px);transform:perspective(400px)}}@keyframes flipInY{0%{-webkit-transform:perspective(400px) rotate3d(0,1,0,90deg);transform:perspective(400px) rotate3d(0,1,0,90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-20deg);transform:perspective(400px) rotate3d(0,1,0,-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotate3d(0,1,0,10deg);transform:perspective(400px) rotate3d(0,1,0,10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-5deg);transform:perspective(400px) rotate3d(0,1,0,-5deg)}100%{-webkit-transform:perspective(400px);transform:perspective(400px)}}.flipInY{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInY;animation-name:flipInY}@-webkit-keyframes flipOutX{0%{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);opacity:1}100%{-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);opacity:0}}@keyframes flipOutX{0%{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);opacity:1}100%{-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);opacity:0}}.flipOutX{-webkit-animation-name:flipOutX;animation-name:flipOutX;-webkit-backface-visibility:visible!important;backface-visibility:visible!important}@-webkit-keyframes flipOutY{0%{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-15deg);transform:perspective(400px) rotate3d(0,1,0,-15deg);opacity:1}100%{-webkit-transform:perspective(400px) rotate3d(0,1,0,90deg);transform:perspective(400px) rotate3d(0,1,0,90deg);opacity:0}}@keyframes flipOutY{0%{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-15deg);transform:perspective(400px) rotate3d(0,1,0,-15deg);opacity:1}100%{-webkit-transform:perspective(400px) rotate3d(0,1,0,90deg);transform:perspective(400px) rotate3d(0,1,0,90deg);opacity:0}}.flipOutY{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipOutY;animation-name:flipOutY}@-webkit-keyframes lightSpeedIn{0%{-webkit-transform:translate3d(100%,0,0) skewX(-30deg);transform:translate3d(100%,0,0) skewX(-30deg);opacity:0}60%{-webkit-transform:skewX(20deg);transform:skewX(20deg);opacity:1}80%{-webkit-transform:skewX(-5deg);transform:skewX(-5deg);opacity:1}100%{-webkit-transform:none;transform:none;opacity:1}}@keyframes lightSpeedIn{0%{-webkit-transform:translate3d(100%,0,0) skewX(-30deg);transform:translate3d(100%,0,0) skewX(-30deg);opacity:0}60%{-webkit-transform:skewX(20deg);transform:skewX(20deg);opacity:1}80%{-webkit-transform:skewX(-5deg);transform:skewX(-5deg);opacity:1}100%{-webkit-transform:none;transform:none;opacity:1}}.lightSpeedIn{-webkit-animation-name:lightSpeedIn;animation-name:lightSpeedIn;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}@-webkit-keyframes lightSpeedOut{0%{opacity:1}100%{-webkit-transform:translate3d(100%,0,0) skewX(30deg);transform:translate3d(100%,0,0) skewX(30deg);opacity:0}}@keyframes lightSpeedOut{0%{opacity:1}100%{-webkit-transform:translate3d(100%,0,0) skewX(30deg);transform:translate3d(100%,0,0) skewX(30deg);opacity:0}}.lightSpeedOut{-webkit-animation-name:lightSpeedOut;animation-name:lightSpeedOut;-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}@-webkit-keyframes rotateIn{0%{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:rotate3d(0,0,1,-200deg);transform:rotate3d(0,0,1,-200deg);opacity:0}100%{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateIn{0%{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:rotate3d(0,0,1,-200deg);transform:rotate3d(0,0,1,-200deg);opacity:0}100%{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:none;transform:none;opacity:1}}.rotateIn{-webkit-animation-name:rotateIn;animation-name:rotateIn}@-webkit-keyframes rotateInDownLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateInDownLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:none;transform:none;opacity:1}}.rotateInDownLeft{-webkit-animation-name:rotateInDownLeft;animation-name:rotateInDownLeft}@-webkit-keyframes rotateInDownRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateInDownRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:none;transform:none;opacity:1}}.rotateInDownRight{-webkit-animation-name:rotateInDownRight;animation-name:rotateInDownRight}@-webkit-keyframes rotateInUpLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateInUpLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:none;transform:none;opacity:1}}.rotateInUpLeft{-webkit-animation-name:rotateInUpLeft;animation-name:rotateInUpLeft}@-webkit-keyframes rotateInUpRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,-90deg);transform:rotate3d(0,0,1,-90deg);opacity:0}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateInUpRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,-90deg);transform:rotate3d(0,0,1,-90deg);opacity:0}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:none;transform:none;opacity:1}}.rotateInUpRight{-webkit-animation-name:rotateInUpRight;animation-name:rotateInUpRight}@-webkit-keyframes rotateOut{0%{-webkit-transform-origin:center;transform-origin:center;opacity:1}100%{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:rotate3d(0,0,1,200deg);transform:rotate3d(0,0,1,200deg);opacity:0}}@keyframes rotateOut{0%{-webkit-transform-origin:center;transform-origin:center;opacity:1}100%{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:rotate3d(0,0,1,200deg);transform:rotate3d(0,0,1,200deg);opacity:0}}.rotateOut{-webkit-animation-name:rotateOut;animation-name:rotateOut}@-webkit-keyframes rotateOutDownLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;opacity:1}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}}@keyframes rotateOutDownLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;opacity:1}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}}.rotateOutDownLeft{-webkit-animation-name:rotateOutDownLeft;animation-name:rotateOutDownLeft}@-webkit-keyframes rotateOutDownRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;opacity:1}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}}@keyframes rotateOutDownRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;opacity:1}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}}.rotateOutDownRight{-webkit-animation-name:rotateOutDownRight;animation-name:rotateOutDownRight}@-webkit-keyframes rotateOutUpLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;opacity:1}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}}@keyframes rotateOutUpLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;opacity:1}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}}.rotateOutUpLeft{-webkit-animation-name:rotateOutUpLeft;animation-name:rotateOutUpLeft}@-webkit-keyframes rotateOutUpRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;opacity:1}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,90deg);transform:rotate3d(0,0,1,90deg);opacity:0}}@keyframes rotateOutUpRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;opacity:1}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,90deg);transform:rotate3d(0,0,1,90deg);opacity:0}}.rotateOutUpRight{-webkit-animation-name:rotateOutUpRight;animation-name:rotateOutUpRight}@-webkit-keyframes hinge{0%{-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}20%,60%{-webkit-transform:rotate3d(0,0,1,80deg);transform:rotate3d(0,0,1,80deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}40%,80%{-webkit-transform:rotate3d(0,0,1,60deg);transform:rotate3d(0,0,1,60deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;opacity:1}100%{-webkit-transform:translate3d(0,700px,0);transform:translate3d(0,700px,0);opacity:0}}@keyframes hinge{0%{-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}20%,60%{-webkit-transform:rotate3d(0,0,1,80deg);transform:rotate3d(0,0,1,80deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}40%,80%{-webkit-transform:rotate3d(0,0,1,60deg);transform:rotate3d(0,0,1,60deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;opacity:1}100%{-webkit-transform:translate3d(0,700px,0);transform:translate3d(0,700px,0);opacity:0}}.hinge{-webkit-animation-name:hinge;animation-name:hinge}@-webkit-keyframes rollIn{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg);transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes rollIn{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg);transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg)}100%{opacity:1;-webkit-transform:none;transform:none}}.rollIn{-webkit-animation-name:rollIn;animation-name:rollIn}@-webkit-keyframes rollOut{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg);transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg)}}@keyframes rollOut{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg);transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg)}}.rollOut{-webkit-animation-name:rollOut;animation-name:rollOut}@-webkit-keyframes zoomIn{0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}50%{opacity:1}}@keyframes zoomIn{0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}50%{opacity:1}}.zoomIn{-webkit-animation-name:zoomIn;animation-name:zoomIn}@-webkit-keyframes zoomInDown{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomInDown{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomInDown{-webkit-animation-name:zoomInDown;animation-name:zoomInDown}@-webkit-keyframes zoomInLeft{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(10px,0,0);transform:scale3d(.475,.475,.475) translate3d(10px,0,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomInLeft{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(10px,0,0);transform:scale3d(.475,.475,.475) translate3d(10px,0,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomInLeft{-webkit-animation-name:zoomInLeft;animation-name:zoomInLeft}@-webkit-keyframes zoomInRight{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomInRight{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomInRight{-webkit-animation-name:zoomInRight;animation-name:zoomInRight}@-webkit-keyframes zoomInUp{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomInUp{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomInUp{-webkit-animation-name:zoomInUp;animation-name:zoomInUp}@-webkit-keyframes zoomOut{0%{opacity:1}50%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}100%{opacity:0}}@keyframes zoomOut{0%{opacity:1}50%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}100%{opacity:0}}.zoomOut{-webkit-animation-name:zoomOut;animation-name:zoomOut}@-webkit-keyframes zoomOutDown{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}100%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);-webkit-transform-origin:center bottom;transform-origin:center bottom;-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomOutDown{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}100%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);-webkit-transform-origin:center bottom;transform-origin:center bottom;-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomOutDown{-webkit-animation-name:zoomOutDown;animation-name:zoomOutDown}@-webkit-keyframes zoomOutLeft{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(42px,0,0);transform:scale3d(.475,.475,.475) translate3d(42px,0,0)}100%{opacity:0;-webkit-transform:scale(.1) translate3d(-2000px,0,0);transform:scale(.1) translate3d(-2000px,0,0);-webkit-transform-origin:left center;transform-origin:left center}}@keyframes zoomOutLeft{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(42px,0,0);transform:scale3d(.475,.475,.475) translate3d(42px,0,0)}100%{opacity:0;-webkit-transform:scale(.1) translate3d(-2000px,0,0);transform:scale(.1) translate3d(-2000px,0,0);-webkit-transform-origin:left center;transform-origin:left center}}.zoomOutLeft{-webkit-animation-name:zoomOutLeft;animation-name:zoomOutLeft}@-webkit-keyframes zoomOutRight{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-42px,0,0);transform:scale3d(.475,.475,.475) translate3d(-42px,0,0)}100%{opacity:0;-webkit-transform:scale(.1) translate3d(2000px,0,0);transform:scale(.1) translate3d(2000px,0,0);-webkit-transform-origin:right center;transform-origin:right center}}@keyframes zoomOutRight{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-42px,0,0);transform:scale3d(.475,.475,.475) translate3d(-42px,0,0)}100%{opacity:0;-webkit-transform:scale(.1) translate3d(2000px,0,0);transform:scale(.1) translate3d(2000px,0,0);-webkit-transform-origin:right center;transform-origin:right center}}.zoomOutRight{-webkit-animation-name:zoomOutRight;animation-name:zoomOutRight}@-webkit-keyframes zoomOutUp{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}100%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);-webkit-transform-origin:center bottom;transform-origin:center bottom;-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomOutUp{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}100%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);-webkit-transform-origin:center bottom;transform-origin:center bottom;-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomOutUp{-webkit-animation-name:zoomOutUp;animation-name:zoomOutUp}@-webkit-keyframes slideInDown{0%{-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0);visibility:visible}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes slideInDown{0%{-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0);visibility:visible}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.slideInDown{-webkit-animation-name:slideInDown;animation-name:slideInDown}@-webkit-keyframes slideInLeft{0%{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);visibility:visible}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes slideInLeft{0%{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);visibility:visible}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.slideInLeft{-webkit-animation-name:slideInLeft;animation-name:slideInLeft}@-webkit-keyframes slideInRight{0%{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);visibility:visible}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes slideInRight{0%{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);visibility:visible}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.slideInRight{-webkit-animation-name:slideInRight;animation-name:slideInRight}@-webkit-keyframes slideInUp{0%{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0);visibility:visible}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes slideInUp{0%{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0);visibility:visible}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.slideInUp{-webkit-animation-name:slideInUp;animation-name:slideInUp}@-webkit-keyframes slideOutDown{0%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}100%{visibility:hidden;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@keyframes slideOutDown{0%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}100%{visibility:hidden;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}.slideOutDown{-webkit-animation-name:slideOutDown;animation-name:slideOutDown}@-webkit-keyframes slideOutLeft{0%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}100%{visibility:hidden;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@keyframes slideOutLeft{0%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}100%{visibility:hidden;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}.slideOutLeft{-webkit-animation-name:slideOutLeft;animation-name:slideOutLeft}@-webkit-keyframes slideOutRight{0%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}100%{visibility:hidden;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}@keyframes slideOutRight{0%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}100%{visibility:hidden;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}.slideOutRight{-webkit-animation-name:slideOutRight;animation-name:slideOutRight}@-webkit-keyframes slideOutUp{0%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}100%{visibility:hidden;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}@keyframes slideOutUp{0%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}100%{visibility:hidden;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}.slideOutUp{-webkit-animation-name:slideOutUp;animation-name:slideOutUp}
@import "/content/Default/LESS/classes.less";

.full-width-row {
    margin-top:0;
}
.visible-xxs {
    display:none;
    @media(max-width:576px){
        display:block;
    }
}
.text-left-xxs {
    @media(max-width:576px){
       text-align:left;
    }
}
.text-right-sm {
    @media(min-width:992px){
      text-align:right;  }
}
.btn-block-xs {
    @media(max-width:767px){
       display:block;
       width:100%;
       margin-top:10px;
    }
}
/* Defaults */
/* Default font */
@default-font-size: 14px;
@default-font-weight: 300;

/* Color Schemes (deprecated since 27-01-2017)*/
/* @import "color-scheme"; */

/* Gradient class */
.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);
}

/* Other classes */
.box-sizing (@type: border-box) {
    -webkit-box-sizing: @type !important;
    -moz-box-sizing: @type !important;
    box-sizing: @type !important;
}

.font-awesome(@icon: "\f230") {
    font-family: FontAwesome;
    font-weight: normal;
    font-style: normal;
    display: inline-block;
    text-decoration: inherit;
    position: absolute;
    content: @icon;
}

.hoverFade(@delay: 5s) {
    -webkit-transition: @delay;
       -moz-transition: @delay;
        -o-transition: @delay;
           transition: @delay;
}

.transitionDelay(@delay: 0s) {
    -webkit-transition-delay: @delay;
    -moz-transition-delay: @delay;
    -o-transition-delay: @delay;
    transition-delay: @delay;
}

.transition(@seconds: 0s) {
    -webkit-transition: @seconds;
    -moz-transition: @seconds;
    -o-transition: @seconds;
    transition: @seconds;
}

.animationDuration(@seconds: 2s) {
    -webkit-animation-duration: @seconds;
    -moz-animation-duration: @seconds;
    -o-animation-duration: @seconds;
    animation-duration: @seconds;
}

.box-shadow (@shadow: 0 0 2px 0 #ccc) {
    -webkit-box-shadow: @shadow;
    -moz-box-shadow: @shadow;
    box-shadow: @shadow;
}

.fadeIn(@seconds: .3s) {
    -webkit-animation: fadeIn @seconds ease-in-out;
       -moz-animation: fadeIn @seconds ease-in-out;
         -o-animation: fadeIn @seconds ease-in-out;
            animation: fadeIn @seconds ease-in-out;
}

.fadeOut(@seconds: .3s) {
    -webkit-animation: fadeOut @seconds ease-in-out;
       -moz-animation: fadeOut @seconds ease-in-out;
         -o-animation: fadeOut @seconds ease-in-out;
            animation: fadeOut @seconds ease-in-out;
}

.rotate(@deg) {
    -webkit-transform: rotate(@deg);
        -ms-transform: rotate(@deg);
            transform: rotate(@deg);
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@-webkit-keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes fadeOut {
    from { opacity: 1; }
    to { opacity: 0; }
}

@-webkit-keyframes fadeOut {
    from { opacity: 1; }
    to { opacity: 0; }
}

.fadeInOut(@seconds: .3s) {
    -webkit-transition: visibility 0s @seconds, opacity @seconds ease-in-out;
    -moz-transition: visibility 0s @seconds, opacity @seconds ease-in-out;
    -o-transition: visibility 0s @seconds, opacity @seconds ease-in-out;
}

.transform(@type) {
    -webkit-transform: @type;
       -moz-transform: @type;
        -ms-transform: @type;
            transform: @type;
}

html {
    position: relative;
    min-height: 100%;
}

/* CSS Class rulers */
    /* Alignment */
    div[class^='vertical-align-'] > *, div[class*=' vertical-align-'] > * {
        display: inline-block;
        float: none;
        margin-right: -4px;
    }

    .vertical-align-top > * {
        vertical-align: top;
    }

    .vertical-align-middle > * {
        vertical-align: middle;
    }

    .vertical-align-bottom > * {
        vertical-align: bottom;
    }

/*
    There are two fonts used within the theme.
    A Sans-Serif font called: Poppins
    and a Serif font called: PT Serif.

    To make it easy to customize fonts accross the site, we assign a custom class to it.
*/
.pt-serif, .pt-serif * {
    //font-family: 'PT Serif', serif !important;
    font-size: 14px !important;
}

.colored {
    color: @thirth-color;
    font-weight: bold;
}

/*
    Make all images automaticle responsive
*/
img {
    max-width: 100%;
    max-height: 100%;
}

/*
    Site specific classes
*/

h3 {
    font-size: 20px;
}

.content-zoom {
    position: relative;
    display: block;
}

.content-zoom > *,
.content-zoom:before,
.content-zoom:after {
    display: block;

    -webkit-transition: all 0.3s;
       -moz-transition: all 0.3s;
            transition: all 0.3s;
}

.content-zoom:hover > *,
.content-zoom:hover:before,
.content-zoom:hover:after {
    -webkit-transform: scale(1.1);
       -moz-transform: scale(1.1);
            transform: scale(1.1);
}

.content-zoom .content-zoom-content {
    position: absolute;
    bottom: 15px;left: 15px;
    z-index: 999;
}

.content-zoom .content-zoom-content > * {
    color: #fff;
    margin: 0;
}

.content-zoom .content-zoom-content h3 {
    font-size: 16px;
}

.box-shadow {
    .box-shadow(0 12px 15px 0 rgba(22, 25, 28, 0.24));
}

.box-overlay {
    position: relative;
}

.box-overlay:after {
    background: rgba(0, 0, 0, .3);
    position: absolute;
    content: "";
    left: 0;top: 0;
    height: 100%;
    width: 100%;
}

.grunge-top:before {
    background: url(../Images/x80-grunge-B&S-white.png);
    background-repeat: repeat-x;
    position: absolute;
    content: "";
    width: 100%;
    left: 0;top: 0;
    height: 55px;
    z-index: 9999;

    -webkit-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
            transform: rotate(180deg);
}
    /*
        Home
    */
    .content-row {
        padding: 40px 0;
        border-bottom: 1px solid #DBE3EE;
    }

    .webshop-categories-row img {
        -webkit-filter: grayscale(100%);
           -moz-filter: grayscale(100%);
                filter: grayscale(100%);
    }
/*
    Some input fields can't be styled.
    We create custom input fields with pure CSS for that.

    Input fields that cant be styled are: checkbox, radio, select ... some more but doens't exist here

    @author     Richard Mauritz
    @package    Solvisoft
*/

/* Use below properties for both checkboxes and radio buttons */
@checkbox-box-size: 18px;
@checkbox-border-size: 1px;
@checkbox-border-color: lighten(@secondary-color, 15%);
@checkbox-disabled-border-color: #e8e8e8;
@checkbox-checked-background-color: lighten(@secondary-color, 15%);
@checkbox-checked-checkmark-color: #fff;
@checkbox-disabled-checked-background-color: #e8e8e8;
@checkbox-disabled-checked-checkmark-color: #ccc;

/* Custom input globals */
.has-custom-checkbox,
.has-custom-radio {
    position: absolute;
    opacity: 0;
    display: none;
    visibility: hidden;
}

/* Custom checkbox input */
.has-custom-checkbox {
    & + span {
        margin-right: 10px;
    }

    & + span,
    & + label {
        display: inline-block;
        vertical-align: middle;
    }

    & + label {
        position: relative;
        height: @checkbox-box-size;
        width: @checkbox-box-size;
        border: @checkbox-border-size solid @checkbox-border-color;
    }

    &:disabled + label {
        border: @checkbox-border-size solid @checkbox-disabled-border-color;
    }

    & + label:before,
    & + label:after {
        position: absolute;
        content: " ";
    }

    & + label:before {
        height: 100%;width: 100%;
        top: 0;left: 0;
    }

    & + label:after {
        top: 50%;left: 50%;
        height: 10px;
        width: 6px;
        margin-left: -3px;
        margin-top: -6px;
        transform: rotate(45deg);
    }

    &:checked + label:before {
        background: @checkbox-checked-background-color;
    }

    &:checked + label:after {
        border-right: 2px solid @checkbox-checked-checkmark-color;
        border-bottom: 2px solid @checkbox-checked-checkmark-color;
    }

    &:disabled:checked + label:before {
        background: @checkbox-disabled-checked-background-color;
    }

    &:disabled:checked + label:after {
        border-right: 2px solid @checkbox-disabled-checked-checkmark-color;
        border-bottom: 2px solid @checkbox-disabled-checked-checkmark-color;
    }
}

/* Custom radio input */
.has-custom-radio {
    & + span {
        margin-right: 10px;
    }

    & + span,
    & + label {
        display: inline-block;
        vertical-align: middle;
    }

    & + label {
        position: relative;
        height: @checkbox-box-size;
        width: @checkbox-box-size;
        border: @checkbox-border-size solid @checkbox-border-color;
        border-radius: 50%;
        overflow: hidden;
    }

    & + label:before,
    & + label:after {
        position: absolute;
        content: " ";
    }

    & + label:before {
        height: 100%;width: 100%;
        top: 0;left: 0;
    }

    &:checked + label:before {
        background: none;
    }

    & + label:after {
        background: #fff;
        top: 50%;left: 50%;
        height: @checkbox-box-size - 8px;
        width: @checkbox-box-size - 8px;
        margin-left: -(@checkbox-box-size - 8px) / 2;
        margin-top: -(@checkbox-box-size - 8px) / 2;
        border-radius: 50%;
    }

    &:checked + label:after {
        background: @checkbox-checked-background-color;
    }
}
/*
    Language selector template

    @package Solvisoft
    @author Richard Mauritz
*/

li.item-language,
li.item-language:hover,
li.item-language .fa-globe,
li.item-language:hover .fa-globe {
    .hoverFade(.33s);
}

li.item-language {
    position: static;
}

li.item-language:hover {
    background: @thirth-color;
}

li.item-language:hover .fa-globe {
    color: #fff;
    cursor: pointer;
}

li.item-language:hover .language-selector-popup {
    display: block;

    .fadeIn(.33s);
}

.language-selector-popup {
    display: none;
    background: @thirth-color,;
    position: absolute;
    z-index: 10000;
    left: 0;
    width: 100%;
    min-height: 300px;
}

.language-selector-popup #language {
    background-image: url(../../Images/dotted_map.png);
    background-repeat: no-repeat;
    max-width: 800px;
    margin: 0 auto;
    height: 100%;
    min-height: 300px;
    padding: 40px 0;
}

.language-selector-popup #language h1 {
    margin-top: 0;
    color: #fff;
    font-weight: bold;
}

.language-selector-popup #language .language-selector {
    padding: 40px 0;
    position: relative;
    background: none;
}

.language-selector-popup #language .language-selector:before,
.language-selector-popup #language .language-selector:after {
    display: table;
    content: "";
    clear: both;
}

.language-selector-popup #language ul,
.language-selector-popup #language ul li,
.language-selector-popup #language ul li a {
    display: block;
    text-align: center;
}

.language-selector-popup #language ul li a {
    color: #fff;
    font-size: 18px;


}

.language-selector-popup #language ul li.active a {
    background: #fff !important;
    color: #004B96 !important;
    text-decoration: none;
    padding: 10px;

}

.language-selector-popup #language ul li a:hover {
    background: #fff !important;
    color: #004B96 !important;
    text-decoration: none;
    padding: 10px;

}

/*
    All typography stylesheets

    @package Solvisoft
    @author Richard Mauritz
    @since 28-11-2017
*/

@import "/content/Default/LESS/typography.less";

h1 {
    margin-top: 30px !important;
}

.faq-question {
    font-weight: bold;
}
/*
    Global classes stylesheet.
    Specific classes which can be used all over the site.

    @package Solvisoft
    @author Richard Mauritz
*/

.border-bottom {
    border-bottom: 1px solid @light-color;
}
/*
    HTML5 Elements can be styled here

    @package Solvisoft
    @author Richard Mauritz
*/

small {
    color: #77716a;
    font-size: 11px;
}

/*
    Blockquote
*/
blockquote {
    margin-left: 40px;
    border-left: 5px solid @thirth-color;
    max-width: 600px;
}
/*
    Breadcrumbs stylesheet

    @package Solvisoft
    @author Richard Mauritz
    @since 27-10-2017
*/

#breadcrumb {
    margin: 25px 0 0;

    & ol,
    & li {
        display: block;
        margin: 0;
        padding: 0;
    }

    & li {
        position: relative;
        display: inline-block;
        color: @medium-gray-color;
        font-size: 12px;

        &~li {
            &:before {
                content: "\0279D";
                padding-right: 5px;
            }
        }
    }

    & a {
        color: @medium-gray-color;

        &:hover {
            color: @thirth-color;
            text-decoration: none;
        }
    }
}

.content-breadcrumb {
    position: absolute;
    width: 100%;
    z-index: 20;
}
/*
    Breadcrumbs stylesheet

    @package Solvisoft
    @author Richard Mauritz
    @since 27-10-2017
*/

#breadcrumb {
    margin: 25px 0 0;

    & ol,
    & li {
        display: block;
        margin: 0;
        padding: 0;
    }

    & li {
        position: relative;
        display: inline-block;
        color: @medium-gray-color;
        font-size: 12px;

        &~li {
            &:before {
                content: "\0279D";
                padding-right: 5px;
            }
        }
    }

    & a {
        color: @medium-gray-color;

        &:hover {
            color: @thirth-color;
            text-decoration: none;
        }
    }
}

.content-breadcrumb {
    position: absolute;
    width: 100%;
    z-index: 20;
}
/*
    Cart stylesheet

    Current cart layout is the same as the basket.
    See /content/views/basket/basket.less for the css rules
*/

.accept-terms {
    > label {
        cursor: pointer;
        background-color: #fff;
        padding: 10px;
        color: @secondary-color;
        margin-bottom: 25px;
        border-radius: @border-radius;

        .box-shadow(1px 1px 3px -1px #ccc);

        span {
            font-weight: bold;
        }

        a {
            color: @thirth-color;
        }
    }
}
/*
    Categorie list navigation

    @package Solvisoft
    @author Richard Mauritz
    @since 10-10-2017
*/

.categories-list-row {

    margin-top: 20px;

    ul, li, a {
        display: block;
        margin: 0;
        padding: 0;
        color: #000;
    }

    .category-list-link,
    .sub-category-list-link {
        position: relative;

        &:after {
            right: 15px;
            top: 10px;

            .font-awesome("\f105")
        }

        &:hover {
            text-decoration: none;
            color: @thirth-color;
        }
    }

    .category-list-link {
        background: #fff;
        padding: 10px;
        font-size: 14px;
        font-weight: 500;
        border-bottom: 1px solid @fifth-color;
        cursor: pointer;
    }

    li {
        ul {
            padding: 10px 0;
        }
    }

    .sub-category-list-link {
        padding: 5px 15px;
    }
}
/*
    Categorie tile navigation row stylesheet

    @package Solvisoft
    @author Richard Mauritz
    @since 05-10-2017
*/

.category-comment {
    margin-top: 25px;
}

.category-tile {
    text-align: center;
    margin-top: 15px;
    margin-bottom: 15px;

    &:hover img {
        opacity: 1;

        .transition(.33s);
    }

    a:hover {
        text-decoration: none;
    }

    .category-image {
        position: relative;
        min-height: 150px;
    }

    .category-description:first-letter{
        text-transform: capitalize
    }
}

.category-tile img {
    position: absolute;
    top: 50%;left: 50%;
    display: block;
    max-height: 150px;
    max-width: 150px;
    margin: 0 auto;

    -webkit-transform: translate(-50%, -50%);
       -moz-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);

    .transition(.33s);
}
/*
    Categorie list navigation

    @package Solvisoft
    @author Richard Mauritz
    @since 10-10-2017
    @editor Jeroen de Jager
*/

.categorie {  
    position: relative;
    margin-bottom: 25px;
}

.categorie img {
    display: inline-block;
    margin: 0 auto;

    max-width: 100%;
    max-height: 100%;
    


    .box-shadow(1px 4px 15px -3px #b7b7b7);
}

.categorie a{
    text-decoration: none;
    position: relative;
    display: block;
    color: #fff;
}

.categorie .categorie-content {    
    position: absolute;
    width: 100%;
    bottom: 0;
    padding: 15px 30px;
    color: #fff;
    text-align: left;

    background-image: -webkit-linear-gradient(90deg, #222, transparent);
    background-image: -moz-linear-gradient(90deg, #222, transparent);
    background-image: -ms-linear-gradient(90deg, #222, transparent);
    background-image: -o-linear-gradient(90deg, #222, transparent);
    background-image: linear-gradient(0deg, #222, transparent);

    .box-shadow(1px 4px 15px -3px #b7b7b7);

    h4 {
        font-size: 12px;
    }
}
/*
    Item content category content blocks stylesheet

    @package CTN
    @author Richard Mauritz
    @since 16-11-2017
*/

.extra-content-blocks {
    .extra-content-image {
        img {
            max-height: 200px;

            border-top-left-radius: @border-radius;
            border-top-right-radius: @border-radius;

            .box-shadow(0 0 10px #ccc);
        }
    }

    .extra-content-title {
        padding: 15px;

        > * {
            font-weight: normal;
            font-size: 18px;
            margin-bottom: 0;

        }
    }

    .extra-content-content {
        padding: 0 15px;
    }
}
/*
    Product accessories stylesheet

    @package Solvisoft
    @author Richard Mauritz
    @since 03-10-2017
*/

.item-accessories .item-relation-image {
    .fa {
        background: @thirth-color;
        position: absolute;
        top: 0;right: 15px;
        color: #fff;
        padding: 9px 10px;
        border-radius: 50%;
    }
}
/*
    Related products stylesheet

    @package Solvisoft
    @author Richard Mauritz
    @since 03-10-2017
*/


/*
    Item relations global sheets

    @package Solvisoft
    @author Richard Mauritz
    @since 03-10-2017
*/

.item-relations {
    padding: 15px 0;

    h3 {
        margin-bottom: 25px;
    }
}

.item-relations .item-relation-image {
    min-height: 200px;
    padding: 15px;
    text-align: center;

    img {
        max-height: 200px;
        margin: 0 auto;
    }
}

.item-relations .item-relation-price,
.item-relations .item-relation-description,
.item-relations .item-relation-link {
    padding: 0 15px 15px;
}
/*
    Language selector template

    @package Solvisoft
    @author Richard Mauritz
*/

li.item-language,
li.item-language:hover,
li.item-language .fa-globe,
li.item-language:hover .fa-globe {
    .hoverFade(.33s);
}

li.item-language {
    position: static;
}

li.item-language:hover {
    background: @thirth-color;
}

li.item-language:hover .fa-globe {
    color: #fff;
    cursor: pointer;
}

li.item-language:hover .language-selector-popup {
    display: block;

    .fadeIn(.33s);
}

.language-selector-popup {
    display: none;
    background: @thirth-color,;
    position: absolute;
    z-index: 10000;
    left: 0;
    width: 100%;
    min-height: 300px;
}

.language-selector-popup #language {
    background-image: url(../../../../../Images/dotted_map.png);
    background-repeat: no-repeat;
    max-width: 800px;
    margin: 0 auto;
    height: 100%;
    min-height: 300px;
    padding: 40px 0;
}

.language-selector-popup #language h1 {
    margin-top: 0;
    color: #fff;
    font-weight: bold;
}

.language-selector-popup #language .language-selector {
    padding: 40px 0;
}

.language-selector-popup #language .language-selector:before,
.language-selector-popup #language .language-selector:after {
    display: table;
    content: "";
    clear: both;
}

.language-selector-popup #language ul,
.language-selector-popup #language ul li,
.language-selector-popup #language ul li a {
    display: block;
    text-align: center;
}

.language-selector-popup #language ul li a {
    color: #fff;
    font-size: 18px;

}

.language-selector-popup #language ul li.active:before {
    margin-top: 1px;
    font-size: 18px;
  
}

/*
    Breadcrumbs stylesheet

    @package Solvisoft
    @author Richard Mauritz
    @since 16-10-2017
*/

#map-canvas {
    height: 280px;
}
/*
    @package Solvisoft
    @author Jan Konert
*/

.news-page-item-wrapper {
    max-width: 800px;
    font-size: 18px;
}

.news-page-item-wrapper p {
    margin: 0 0 30px;
}

.news-page-detail-wrapper .news-detail-date {
    background-color: @fourth-color;
    display: inline-block;
    padding: 2px 10px;
    color: #ffffff;
    font-size: 15px;
    font-style: normal;
    margin: 20px 0;
    font-weight: bold;
}

.news-page-wrapper .news-page-item-wrapper h2 {
    color: @fourth-color;
    margin-bottom: 30px;
}



/*
    Order tabs stylesheet

    @package Solvisoft
    @author Richard Mauritz
    @since 23-11-2017
*/

.order-nav-tabs {
    background: #fff;
    overflow: visible;
    border-bottom: 0;
    padding: 15px 15px 30px 25px;
    margin-bottom: 20px;

    .box-shadow(1px 1px 3px -1px #ccc);

    li {
        padding-left: 0;

        span {
            background: #fff;
            position: relative;
            display: inline-block;
            border: 1px solid @medium-gray-color;
            border-radius: 50%;
            height: 40px;
            width: 40px;
            color: @medium-gray-color;
            margin-right: 100px;

            i {
                position: absolute;
                top: 50%;left: 50%;
                transform: translate(-50%, -50%);
            }

            &:before {
                position: absolute;
                content: " ";
                height: 1px;
                width: 106px;
                background: @medium-gray-color;
                top: 50%;left: 91px;
                transform: translate(-50%);
            }

            small {
                position: absolute;
                top: 45px;
                margin-left: -80px;
                width: 200px;
                text-align: center;
                font-size: 11px;
            }
        }

        &:last-child {
            span {
                &:before {
                    display: none;
                }
            }
        }

        &.active {
            span {
                color: @secondary-color;
                border-color: @secondary-color;
            }
        }

        &.checked {
            span {
                color: @secondary-color;
                border-color: @secondary-color;

                &:before {
                    background: @secondary-color;
                }
            }
        }
    }
}
@media (max-width: 991px) {
    .order-nav-tabs {
        li {
            span {
                margin-right: 50px;

                &:before {
                    width: 57px;
    left: 66px;
                }
            }
        }
    }
}

@media (max-width: 660px) {
    .order-nav-tabs {
        li {
            display: none !important;

            span {
                margin-right: 0;

                small {
                    width: auto;
                    margin-left: 0;
                    transform: translate(-50%);
                }
            }

            span::before {
                display: none !important;
            }
        }

        li.active {
            display: block !important;
            width: 100%;
            text-align: center;
        }
    }
}

/*
    Page article inline blocks template

    @package Solvisoft / CTM
    @author Richard Mauritz
    @since 11-10-2017
*/

.content-inline-blocks {
    img {
        border-top-left-radius: @border-radius;
        border-top-right-radius: @border-radius;
    }
}
/*
    Newsfeed stylesheet

    @package B&S Autoparts / solvisoft
    @author Richard Mauritz
    @since 09-10-2017
*/

.customer-feedback {
    margin: 40px 0;
    padding: 50px 0;
    border: 1px solid @light-color;

    .box-shadow(0 0 10px #ccc);
}

#customerFeedbackCarousel .profile-pic img {
    max-width: 100px;
    border-radius: 50%;
}

#customerFeedbackCarousel blockquote {
    border-left: 0;
    color: @thirth-color;
    font-size: 14px;
    padding: 20px 40px;

    small {
        color: #808080;
    }
}

#customerFeedbackCarousel .carousel-control {
    background: none;
    color: @medium-gray-color;
    opacity: 1;
    text-shadow: none;

    span {
        font-size: 18px;
    }

    .glyphicon-chevron-left {
        left: 15px;
    }

    .glyphicon-chevron-right {
        right: 15px;
    }
}
/*
    Page article relation stylesheet

    @package Solvisoft
    @aurhor Richard Mauritz
    @since 16-11-2017
*/

.page-article-relation-wrapper {
    .page-article-relation-content {
        position: absolute;
        margin-top: 150px;
        font-size: 22px;
        line-height: 35px;
        color: lighten(@secondary-color, 30%);
    }
}
/*
    Pagetext stylesheet. Belongs to the pagetext template file

    @package Solvisoft
    @author Richard Mauritz
*/

.page-text-default .page-text-content {
    color: @thirth-color;
}
/*
    Searchbox stylesheet

    @package Solvisoft
    @author Richard Mauritz
*/

#searchform,
#searchformmobile {
    position: relative;
}

#searchform button,
#searchformmobile button {
    position: absolute;
    background: none;
    border: none;
    top: 12px;right: 12px;
    color: @medium-gray-color;
    outline: none;

    .hoverFade(.3s);
}

#searchform input.form-control,
#searchformmobile input.form-control {
    background: lighten(@secondary-color, 15%);
    border: 1px solid lighten(@secondary-color, 15%);
    border-radius: 5px;
    color: #fff;
}

#searchform input.form-control:focus,
#searchformmobile input.form-control:focus {
    border: 1px solid lighten(@fourth-color, 0%);
}

#searchform input.form-control:focus + button,
#searchformmobile input.form-control:focus + button {
    color: @fourth-color;

    .hoverFade(.3s);
}

#searchform .search-auto-complete,
#searchformmobile .search-auto-complete {
    background: lighten(@secondary-color, 15%);
    width: 100%;
    border-radius: 5px;
    z-index: 10000;
    border: 1px solid @secondary-color;
    margin-top: -1px;
}

#searchform .search-auto-complete ul,
#searchform .search-auto-complete ul li,
#searchformmobile .search-auto-complete ul,
#searchformmobile .search-auto-complete ul li {
    display: block;
    margin: 0;
    padding: 0;
}

#searchform .search-auto-complete ul li,
#searchformmobile .search-auto-complete ul li {
    padding: 5px 10px;

    .hoverFade(.33s);
}

#searchform .search-auto-complete ul li:hover,
#searchform .search-auto-complete ul li.auto-item-selected,
#searchformmobile .search-auto-complete ul li:hover,
#searchformmobile .search-auto-complete ul li.auto-item-selected {
    background: none;
    cursor: pointer;
    color: @fourth-color;

    .hoverFade(.33s);
}

#searchform .search-auto-complete ul li:hover a,
#searchform .search-auto-complete ul li.auto-item-selected a,
#searchformmobile .search-auto-complete ul li:hover a,
#searchformmobile .search-auto-complete ul li.auto-item-selected a {
    color: @fourth-color;
}

#searchform .search-auto-complete .search-btn-row,
#searchformmobile .search-auto-complete .search-btn-row {
    margin: 10px;
}

autocomplete-form {
    position: relative;
    display :block;
}

autocomplete-results {
    background: lighten(@secondary-color, 15%);
    position: absolute;
    width: 100%;
    z-index: 210;

    .box-shadow(0 0 3px -1px #ccc);
    
    ul {
        display: block;
        padding: 0;
        margin: 0;
        float: none;
    }

    li {
        display: block;

        a {
            padding: 10px;
            display: block;
            cursor: pointer;
            color: #fff;

            &:hover {
                color: initial;
                text-decoration: none;
            }
        }

        &.selected {
            a {
                /*background: @light-gray-color;*/
                text-decoration: none;
                color: @fourth-color;
            }
        }
    }
}
/*
    Shopping cart stylesheet

    @package Solvisoft
    @author Richard Mauritz
*/

.shopping-cart {
    padding-right: 10px;

    > a {
        position: relative;

        &:hover {
            text-decoration: none;
        }

        .fa {
            color: @primary-color;
            font-size: 24px;

            .transition(.12s);

            & + .badge {
                background: @thirth-color;
                color: #fff;

            }
        }

        .fa.active {
            color: @light-gray-color;

            .transition(.12s);

            & + .badge {
                background-color: @fourth-color;
                color: @secondary-color;

                .transition(.12s);
            }
        }

        .badge {
            position: absolute;
            top: -12px;right: -12px;
            border-radius: 0px;

            .transition(.12s);
        }
    }
}

shopping-cart,
shopping-cart-item,
shopping-cart-show-more,
shopping-cart-totals,
shopping-cart-total,
shopping-cart-buttons {
    display: block;
}

shopping-cart {
    background-color: #fff;
    position: absolute;
    color: @font-color;
    min-width: 440px;
    max-width: 440px;
    top: 44px;right: 15px;
    padding: 15px;
    display: none;
    z-index: 11000;

    .box-shadow(1px 1px 3px -1px #ccc);

    h3 {
        margin: 15px 0 25px;
    }

    shopping-cart-item {
        background-color: @light-gray-color;
        padding: 10px;
        margin-bottom: 10px;
        
        a {
            color: @font-color !important;
        }

        .fa {
            background-color: transparent;
            border: 0;
            color: @font-color !important;
            margin-top: -3px;
        }
    }

    shopping-cart-show-more {
        small {
            cursor: pointer;
            color: #707070;
        }
    }

    shopping-cart-totals {
        font-size: 16px;

        shopping-cart-total {
            padding: 10px;

            &:last-child {
                color: @thirth-color;
            }
        }
    }

    shopping-cart-buttons {
       margin-top: 15px;
    }
}

@media (max-width: 468px) {
    shopping-cart {
        min-width: 380px;
        max-width: 380px;
    }
}

@media (max-width: 396px) {
    shopping-cart {
        min-width: 340px;
        max-width: 340px;
    }
}
/*
    Homeslider stylesheet

    @package Solvisoft / CTM
    @author Richard Mauritz
    @since 10-10-2017
*/

.home-slider {
    position: relative;
    margin-top: -80px;

    .carousel-caption {
        position: absolute;
        padding-top: 150px;
        text-shadow: none;
        width: 100%;
        top: 0;left: 0;
        text-align: left;

        small {
            position: relative;
            font-size: 16px;
        }

        h1 {
            margin-top: 0;
        }
    }

    .item {
        min-height: 600px;
        /*
            Slider overlay
        */
        &:after {
            position: absolute;
            content: " ";
            top: 0;left: 0;
            height: 100%;
            width: 100%;

            .gradient(linear; #000, transparent;90deg);
        }
    }
}

.home-slider .slider-blocks {
    position: absolute;
    width: 100%;
    bottom: -40px;

    .slider-block {
        margin-bottom: 15px;
        position: relative;
        z-index: 20;

        h2 {
            margin-top: 0;
        }

        > div {
            padding: 25px;
            border-radius: @border-radius;
        }

        &:first-child > div {
            background: @primary-color;
            border: 1px solid @light-gray-color;
        }

        &:last-child > div {
            background: @fourth-color;
            color: @primary-color;
        }
    }
}

@media (max-width: 768px) {
    .home-slider {
        position: relative;
        margin-top: 0;
    }
}
/*
    Homeslider stylesheet

    @package Solvisoft / CTM
    @author Richard Mauritz
    @since 10-10-2017
*/

.home-slider {
    position: relative;
    margin-top: -80px;

    .carousel-caption {
        position: absolute;
        padding-top: 150px;
        text-shadow: none;
        width: 100%;
        top: 0;
        left: 0;
        text-align: left;

        small {
            position: relative;
            font-size: 16px;
        }

        h1 {
            margin-top: 0;
        }
    }

    .item {
        min-height: 600px;
        /*
            Slider overlay
        */
        &:after {
            position: absolute;
            content: " ";
            top: 0;
            left: 0;
            height: 100%;
            width: 100%;

            .gradient(linear; #000, transparent;90deg);
        }
    }
}

.home-slider .slider-blocks {
    position: absolute;
    width: 100%;
    bottom: -40px;

    .slider-block {
        margin-bottom: 15px;
        position: relative;
        z-index: 20;

        h2 {
            margin-top: 0;
        }

        > div {
            padding: 25px;
            border-radius: @border-radius;
        }

        &:first-child > div {
            background: @primary-color;
            border: 1px solid @light-gray-color;
        }

        &:last-child > div {
            background: @fourth-color;
            color: @primary-color;
        }
    }
}

@media (max-width: 768px) {
    .home-slider {
        position: relative;
        margin-top: 0;
    }
}


#homeSlider .carousel-inner:after, #PageArticleSlider .carousel-inner:after {
    background-image: url(../../../../../Images/x80-grunge-B&S-white.png);
    background-repeat: repeat no-repeat;
    background-position: bottom;
    position: absolute;
    content: "";
    bottom: 0;
    left: 0;
    height: 50px;
    width: 100%;
    z-index: 10;
}

.carousel-indicators-container {
    position: absolute;
    bottom: 50px;
    width: 100%;
    z-index: 20;
}


.carousel-indicators {
    text-align: right;

    li {
        background: #fff;
    }

    li.active {
        margin: auto 2px;

        &:after {
            background-color: @thirth-color;
            border: 0px;
            left: -3px;
            width: 10px;
            height: 10px;
        }
    }
}

/*
    Add to favorite modal

    @package Solvisoft
    @author Richard Mauritz
    @since 17-01-2018
*/

#AddToFavouriteModal {
    .modal-body {
        max-height: 500px;
        overflow: auto;
    }
}
/*
    Cookie popup stylesheet

    @package Solvisoft
    @author Richard Mauritz
    @since 01-11-2017
*/


/*
    Favourite list template stylesheet

    @package Solvisoft
    @author Richard Mauritz
    @since 20-11-2017
*/

.favourites {
    input[type="number"] {
        max-width: 100%;
        border: 1px solid @medium-gray-color;
        border-radius: @border-radius;
        padding: 4px 6px;
    }
}
/*
    New basket item popup stylesheet
*/

new-basket-item-popup,
nbi-title, nbi-body, nbi-footer {
    display: block;
}

new-basket-item-popup {
    background-color: #fff;
    position: absolute;
    width: 300px;
    right: 15px;
    margin-top: 15px;
    text-align: left;
    font-size: 14px;
    visibility: hidden;
    opacity: 0;
    z-index: 10500;
    .box-shadow(1px 4px 15px -3px #b7b7b7);

    &:before {
        position: absolute;
        content: " ";
        width: 0;
	    height: 0;
        top: -10px;right: 20px;
	    border-left: 7px solid transparent;
	    border-right: 7px solid transparent;
	    border-bottom: 10px solid @light-gray-color;
    }

    nbi-title {
        background-color: darken(@thirth-color, 5%);
        color: #fff;
        padding: 10px;

    }

    nbi-body {
        display: flex;
        flex-direction: row;
        text-align: left;
        margin-bottom: 10px;
        padding: 10px;
        border-bottom: 1px solid #ededed;        

        img {
            max-width: 50px;
            max-height: 50px;
            border: 1px solid #ccc;
        }

        a {
            padding-left: 10px;
            padding-right: 5px;
            color: @secondary-color;
        }
    }

    nbi-footer {
        padding: 10px;
    }
}
/*
    Login page or login template popup

    @package Solvisoft
    @author Richard Mauritz
*/

.loginbuttondiv a {
    float: right;
}

.forgot_password_form {
    display: none;
}

/*
    Article slider stylesheet

    @package Solvisoft
    @author Richard Mauritz
    @since 28-11-2017
*/

#articleSlider {
    background: #fff;
    border: 2px solid #fff;
    margin-top: 25px;

    .item {
        padding: 15px;
        max-height: 300px;
        min-height: 300px;

        .magnifying-glass {
            background-color: @thirth-color;
            position: absolute;
            right: 15px;
            top: 15px;
            color: #fff;
            height: 40px;
            width: 40px;
            border-radius: 50%;

            .fa {
                font-size: 18px;
                position: absolute;
                top: 50%;left: 50%;
                margin-left: -8px;
                margin-top: -9px;
            }
        }
    }

    img {
        max-height: 270px;
    }

    .carousel-indicators-container {
        bottom: -40px;
        margin-bottom: 20px;
    }

    .carousel-indicators {
        text-align: center;

        li {
            background: @medium-gray-color;
        }

        li.active {
            margin: auto 2px;

            &:after {
                height: 12px;
                width: 12px;
                border-color: @medium-gray-color;
                top: -3px;left: -3px;
            }
        }
    }
}
/*
    Newsfeed stylesheet

    @package B&S Autoparts / Solvisoft
    @author Richard Mauritz
    @since 09-10-2017
*/

.top-news-wrapper {
    background: @light-color;
    padding: 50px 0;
}

.top-news-item .top-news-item-content {
    padding: 15px;
}

.top-news-item .top-news-item-image {
    .box-shadow(0 12px 15px 0 rgba(22, 25, 28, 0.24));
}
/*
    @package Solvisoft
    @author Jan Konert
*/

// News blocks on the home page are the same as on the new page
// See news/news.less for the stylesheet.
/*
    Footer stylesheet

    @package Solvisoft
    @author Richard Mauritz
    @editor Jeroen de Jager
*/

/*Complete Footer*/
#footer {
    background-color: @footer-background-color;
    color: @footer-text-color;
}

/*Complete Footer*/
#footer .footer-extra-content-row {
    color: @footer-extra-content-row-color;
    padding: 80px 0;
    z-index:2;
}

#footer .footer-sitemap-row {
    padding: 15px 0;
}

/*Social Row*/

#footer .footer-social-row {
    background: @footer-social-row-background-color;
    padding: 15px 0;

    h3 {
        margin: 0;
    }

    h3, a {
        color: @footer-social-row-text-color;
        font-size: 16px;
    }

    a:hover {
        color: @footer-social-row-text-color-hover;
        text-decoration: none;
    }
}


/*Footer section*/

#footer #footer-note {
    h1, h2, h3,
    h4, h5, h6 {
        color: @footer-content-text-color;
        font-weight: 600;
        font-size: 14px;
    }

    span, p {
        color: @footer-content-text-color;
        font-size: 13px;
    }

    a, small {
        color: @footer-content-link-text-color;
        font-size: 14px;
    }

    a:hover {
        color: @footer-content-link-text-color-hover;
    }
}


/*Copyright*/

#footer #footer-copyright {
    padding: 15px 0;
    color: @footer-copyright-text-color;
    background-color: @footer-copyright-background-color;
    font-size: 11px;
    text-align: center;

    a {
        color: @footer-copyright-link-color;
        text-decoration: underline;
    }
}

/*Jeep*/

#footer .animated-jeep-row {
    position: absolute;
    margin-top: -30px;
}

#footer .animated-jeep-row img {
    position: relative;
    max-width: 75px;
    left: 30%;
}
/*
    Header stylesheets

    @author     Richard Mauritz
    @package    Solvisoft
*/

header .login-header {
    background-color: @thirth-color;
    color: #fff;
    padding: 10px;
}

header .login-header a {
    color: #f2f2f2;
}

header {
    position: relative;
    z-index: 50;

    .top-bar {
        background-color: @top-bar-background-color;
        padding: 10px 0;
        font-size: @top-bar-font-size;
        color: @top-bar-text-color;

        .fa {
            color: @top-bar-icon-color;
        }

        a {
            color: @top-bar-link-color;
        }
    }

    .mobile-header {
        padding: 15px;
    }

    .primary-header {
        background-color: @primary-header-background-color !important;
        padding: 15px 0;
        background: url('../../../../../Images/grunge-top-left.png') top left, url('../../../../../Images/grunge-top-right.png') top right;
        background-repeat: no-repeat;
        z-index: 23;

        .fa {
            color: @primary-header-icon-color;
        }

        .white-link a {
            color: #fff;
        }
    }

    .secondary-header {
        background-color: @secondary-header-background-color;
        
    }
}


/*
    Mobile menu stylesheet

    @package    Solvisoft
    @author     Richard Mauritz
*/

@hamburger-menu-color: #9b9b9b;
@mobile-heading-color: #9b9b9b;
@mobile-menu-background-color: #333;
@mobile-menu-link-color: @medium-gray-color;
@mobile-menu-link-hover-color: #fff;

[ng-toggle-mobile-menu] {
    background-color: transparent;
    border: none;
    font-size: 24px;
    outline: none;
    color: @hamburger-menu-color !important;
}

mobile-menu {
    background: @mobile-menu-background-color;
    position: fixed;
    height: 100vh;
    top: 0;left: -100%;
    overflow: auto;
    z-index: 3000;

    .box-shadow(inset -2px 0px 10px -5px darken(@mobile-menu-background-color, 100%)); // This allways translates into #000000

    .title {
        font-weight: bold;
        padding: 10px 10px 0;
        color: #999;
    }

    .account {
        background-color: #212121;
        padding: 20px 10px;

        .gravatar, .user {
            float: left;
        }

        .cart {
            float: right;
        }

        &::before,
        &::after {
            display: table;
            content: " ";
            clear: both;
        }

        .gravatar {
            margin-right: 10px;

            img {
                background: #555;
                max-width: 45px;
                border-radius: 2px;
                border: 1px solid #222;
                border-radius: 50%;
            }
        }

        .cart {
            .fa {
                font-size: 18px;
                color: #999;
                margin-right: 15px;
            }

            .badge {
                position: absolute;
                top: 10px;right: 10px;
                color:white;
                
            }
        }

        strong a {
            color: #fff;
            font-size: 14px;
        }

        a {
            color: #999;
            font-size: 12px;
        }
    }

    .search {
        padding: 10px;

        #searchformmobile {
            .form-control {
                background-color: #111;
                border: 0;
                color: #fff;
            }
        }
    }

    .nav.navbar-nav {
        float: none;
        margin: 0;
        padding: 0;
        width: 100%;

        > li {
            position: relative;
            display: block;
            padding-right: 0;
            width: 100%;

            > a {
                color: @mobile-menu-link-color;
                padding: 10px 10px 10px 20px;
            }
        }

        > li.isActive,
        > li:hover {
            > a {
                background-color: @thirth-color;
                color: @mobile-menu-link-hover-color;
                border-radius: 0;
                cursor: pointer;
            }

            &::after {
                color: @mobile-menu-link-hover-color;
            }
        }

        > li::after {
            top: 10px;right: 15px;
            color: @mobile-menu-link-color;

            .font-awesome("\f105");
        }

        .nav {
            display: block;
            background-color: @mobile-menu-background-color;
            > li {
                > a {
                    padding-left: 30px;
                }
            }
        }
    }
}


@media (min-width: 200px) {
    mobile-menu {
        width: 250px;
    }
}

@media (min-width: 360px) {
    mobile-menu {
        width: 300px;
    }
}
.assortment-category {

    .category-row {

        padding-top: 20px;

    }

    .page-title {
        margin-bottom: 20px;
    }
}
/*
    Article details stylesheet

    @package Solvisoft
    @author Richard Mauritz
    @since 17-10-2017
*/

.article-download {
    position: relative;
    border: 2px solid @light-color;
    border-radius: 5px;
    padding: 25px;

    .btn-link {
        position: absolute;
        right: 15px;
        top: 13px;
    }
}

#article-details {
    .item-image {
        border: 1px solid #ccc;
    }

    h3 {
        margin-top: 0;
        margin-bottom: 30px;
    }

    #specifications {
        padding: 80px 15px;
    }

    .container-fluid {
        background: @primary-color;
        color: #fff;
        padding: 80px 15px;
    }

    .article-description {
        p {
            margin-bottom: 30px;
        }
    }

    .add-to-basket {
        .basket-quantity-control,
        .btn-primary {
            float: left;
            border-radius: 0;
            height: 42px;
            line-height: 21px;

            &:hover{
                border-color: @thirth-color;
            }
        }

        .basket-quantity-control {
            width: 20%;
            border-top-left-radius: 3px;
            border-bottom-left-radius: 3px;
        }

        .btn-primary {
            border-left: 0;
            width: 80%;
            border-top-right-radius: 3px;
            border-bottom-right-radius: 3px;
        }

        &:before,
        &:after {
            display: table;
            content: " ";
            clear: both;
        }
    }
}

#specifications {
    ul li {
        margin-bottom: 10px;
    }
}
/*
    Stylesheet for shop.
    The style defenitions for the grid and list view are also written here

    @package Solvisoft / BTC
    @author Richard Mauritz
    @since 11-10-2017
*/

#shopping-list {
    border-bottom: 2px solid @light-gray-color;
    padding-bottom: 25px;

    .shopping-item {
        padding-left: 0;
        padding-right: 0;
    }

    table {
        td {
            padding: 0 15px;
        }
    }

    .shopping-item-image {
        width: 30%;

        img {
             max-width: 150px;
             min-width: 150px;
        }
    }

    .shopping-item-quanity {
        float: right;
        max-width: 120px;
        margin-bottom: 10px;
    }
}

.grid-control {
    border-bottom: 2px solid @light-gray-color;
    padding-bottom: 15px;

    .pagination {
        float: left;
        margin: 0;
    }

    .amount-per-page {
        background-color: transparent;
        border: 0;
        border-bottom: 2px solid #000;
        font-weight: bold;
        outline: none;

        &:focus {
            border-color: @thirth-color;
        }
    }

    .btn-grid {
        background-color: transparent;
        border: none;
        font-size: 18px;
        color: @medium-gray-color;
        padding: 0;
        padding-left: 5px;

        .transition(.33s);

        &.active {
            color: @thirth-color;

            .transition(.33s);
        }

        &:hover {
            color: @thirth-color;
            .transition(.33s);
        }

        &:focus {
            color: darken(@thirth-color, 5%);
            outline: none;

            .transition(.33s);
        }
    }
}

.shopping-item {
    display: block;
    padding: 10px 15px;
    background: @primary-color;
    margin-bottom: 5px;    

    a {
        display: block;
    }

    a:hover {
        text-decoration: none;
        color: @secondary-color;

        strong {
            color: @thirth-color;

            .transition(.33s);

            &:hover {
                .transition(.33s);
            }
        }
    }

    table, tr, td {
        width: 100%;
    }

    table {
        height: 100%;
    }

    .box-shadow(1px 1px 3px -1px #ccc);
}

.shopping-item .shopping-item-image {
    text-align: center;
}

.shopping-item .shopping-item-price {
    font-size: 18px;

    input[type=number], strong {
        display: inline-block;
        vertical-align: middle;
    }

    input[type=number] {
        position: relative;
        max-width: 40px;
        padding: 5px;
        outline: none;
        margin-top: -2px;
        border-radius: @border-radius;
        border: 1px solid @light-gray-color;
    }
}

.stock-icon {
    background-color: #36e046;
    display: inline-block;
    height: 10px;
    width: 10px;
    margin-right: 5px;
    border-radius: @border-radius;

    &.red {
        background-color: #ff0000;
    }

    &.orange {
        background-color: #ed7d31;
    }

    &.green {
        background-color: #36e046;
    }
}

.shopping-item .shopping-item-add {
    .btn-link {
        border: 0;
        padding: 0;

        small {
            font-size: 12px;
        }

        &:hover {
            color: #000 !important;
            text-decoration: underline !important;
        }
    }
}

.shopping-item .shopping-item-quanity {
    position: relative;

    .error-notification {
        position: absolute;
        left: -25px;
        top: 7px;
        color: @warning-color;
    }
}

/*
    Grid view
*/
.grid-view {
    .item-block {
        height:360px;

        @media(max-width:1200px) and (min-width:576px){
            height:380px;
        }
    }
    .item-description a {
            display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-break: break-word;
    overflow: hidden;
    }
}
#shopping-grid {
    display: flex;
    flex-wrap: wrap;
    padding-right: 10px;

    .shopping-item {
        padding-bottom: 15px;
        height: 100%;
    }

    .grid {
        padding-left: 5px;
        padding-right: 5px;
        margin-bottom: 5px;
    }

    .shopping-item .shopping-item-add {
        margin-top: 15px;
    }

    .shopping-item .shopping-item-image {
        display: block;
        min-height: 130px;
        max-height: 130px;
    }

    .shopping-item .shopping-item-image img {
        max-width: 100px;
        max-height: 150px;
        display: block;
        margin: 0 auto;
        padding: 15px 0;
    }
}

/*
    Basket stylesheet

    @package Solvisoft
    @author Richard Mauritz
*/

#basket .fa-times {
    background: none;
    border: none;
    color: @thirth-color;
}

.basket .basket-header {
    font-size: 14px;
    margin-top: 10px;
}

.basket .basket-quantity-control {
    max-width: 80px;
}

.basket .basket-item-delete {
    background-color: transparent;
    color: #999;
    border: 0;
    padding: 0;

    .transition(.33s);

    &:hover {
        color: #000;

        .transition(.33s);
    }
}

.basket .button-row {
    padding: 15px 0;
}

.cart-totals {
    .totals-row {
        padding: 10px 0;
    }
    @media(max-width:767px){
        font-size:13px;
    }
}
.input-mobile {
    @media(max-width:991px){
        padding:3px 15px!important;
    }
}
.table-header-row {
    font-size:13px;
}
.remove-table-padding {
    @media(max-width:767px){
        .table-column {
            padding:5px 15px!important;
        }
        
    }
}
.basket-hidden {
    display:none;
}

body {
}

/*
    Configurator index stylesheet

    @package Solvisoft
    @author Richard Mauritz
    @since 30-10-2017
*/

/*
    Copied from 04 ...
*/
/* Configurator module */
        /* Steps */
        #configurator .configurator-steps {
            margin-top: 40px;
        }

        #configurator .configurator-steps .col-step {
            margin-top: 15px;
        }

        #configurator .configurator-steps .step {
            border: 1px solid #f2f2f2;
            padding: 15px;
            color: @thirth-color;
            text-align: center;
        }

        #configurator .configurator-steps .step.current-step {
            background: @thirth-color;
            border-color: @thirth-color;
            color: #fff;
        }

        #configurator .configurator-steps .step.clickable:hover {
            background: #f1f1f1;
            cursor: pointer;
        }
    
        /* Configurator */
        #configurator {}

        #configurator table {
            width: 100%;
        }

        #configurator .configurator {
            position: relative;
            margin-top: 40px;
            padding: 0 0 40px;
        }

        #configurator .configuration-row {
            background: #fff;
            margin-top: 15px;

            .box-shadow( 0px 2px 3px -1px #ccc );

            &:last-child {
                background: transparent;
                position: fixed;
                bottom: -45px;left: 0;
                width: 100%;
                z-index: 99;
            }

            &:last-child .configurator-heading {
                background: @thirth-color !important;
            }

            &:last-child .configurator-heading,
            &:last-child .configurator-heading i {
                color: #fff;
            }

            &:last-child .custom-select-container,
            &:last-child .custom-select-container i {
                color: #000;
            }

            &:last-child.toggle-up,
            &:last-child.toggle-down {
                bottom: 0;
                .transition(.0s) !important;
            }

            &:last-child.toggle-down {
                bottom: -45px;
            }
            
            &:last-child.reset-position .configurator-heading {
                background: #f2f2f2 !important;
            }

            &:last-child.reset-position .configurator-heading {
                color: #000;
            }

            &:last-child.reset-position .configurator-heading i {
                color: @secondary-color;
            }

            &:last-child .configurator-content {
                max-height: 0;
                overflow: hidden;
            }

            &:last-child.toggle-up .configurator-content {
                max-height: 500px;
                overflow: auto;
            }

            &:last-child.toggle-down .configurator-content {
                max-height: 0;
            }

            &:last-child .configurator-content.collapseable {
                cursor: auto !important;
            }

            &:last-child .configurator-content.collapseable:hover {
                background: initial !important;
            }

            &:last-child.reset-position {
                background: transparent;
                position: relative;
                bottom: auto;left: auto;
                width: auto;
                z-index: auto;
            }

            &:last-child.reset-position .container {
                padding: 0px;
                max-width: 1140px;
            }

            &:last-child.reset-position .configurator-content {
                max-height: 100%;
            }
        }

            // Fix last child. Last child is configuration overview
            #configurator .configuration-row:last-child .configuration-row-background {
                background: #fff;

                .box-shadow( 0px 2px 3px -1px #ccc );
            }

            #configurator .configuration-row:last-child .configurator-heading {
                background: #fff;
            }

        #configurator .configurator-heading {
            background: #f2f2f2;
            padding: 15px;
        }

        #configurator .configurator-heading .icon-info-outline {
            font-size: 24px;
            margin-left: 15px;
            color: @secondary-color;
        }

        #configurator .configurator-heading.has-select span, 
        #configurator .configurator-heading.has-select i,
        #configurator .configurator-heading.has-select select,
        #configurator .configurator-heading.has-select .custom-select-container {
            display: inline-block;
            vertical-align: middle;
        }

        #configurator .configurator-heading h2 {
            margin: 0;
            font-size: 14px;
            font-weight: bold;
        }

        #configurator .configurator-heading h2 span {
            font-weight: normal;
        }

        #configurator .configurator-heading > div > div {
            float: none;
            display: inline-block;
            margin-right: -4px;
            vertical-align: middle;
        }

        #configurator .configurator-heading-small {
            margin: 20px 0;
        }

        #configurator .configurator-heading-small h1,
        #configurator .configurator-heading-small h2,
        #configurator .configurator-heading-small h3,
        #configurator .configurator-heading-small h4,
        #configurator .configurator-heading-small h5,
        #configurator .configurator-heading-small h6,
        #configurator .configurator-heading-small span {
            display: inline-block;
            vertical-align: middle;
            margin: 0;
        }

        #configurator .configurator-heading-small h1,
        #configurator .configurator-heading-small h2,
        #configurator .configurator-heading-small h3,
        #configurator .configurator-heading-small h4,
        #configurator .configurator-heading-small h5,
        #configurator .configurator-heading-small h6 {
            font-size: 16px;
            font-weight: bold;
        }

        #configurator .configurator-heading-small span {
            margin-left: 25px;
        }

        #configurator .configurator-content {
            padding: 20px 60px;
            overflow-x: hidden !important;
        }

        @media (max-width: 640px) {
            #configurator .configurator-content {
            padding: 15px;
        }
        }

        #configurator .configurator-content .custom-checkbox-wrapper label {
            top: 10px;left: 10px;
        }

        #configurator .configurator-content h3 {
            font-size: 14px;
            font-weight: bold;
        }

        #configurator .configurator-content table {
            border: 1px solid #f2f2f2;
        }

        #configurator .configurator-content table tr {
            border-bottom: 1px solid #f2f2f2;
        }

        #configurator .configurator-content table thead {
            background: #f2f2f2;
        }

        #configurator .configurator-content table thead th {
            font-weight: normal;
            padding: 10px;
        }

        #configurator .configurator-content table tbody td {
            vertical-align: middle;
            padding: 10px;
        }

        #configurator .configurator-content table tbody tr.default {
            font-weight: bold;
            color: @thirth-color;
        }

        #configurator .configurator-content table tbody tr.selectable:hover {
            cursor: pointer;
            background: #f9f9f9;
        }

        #configurator .configurator-content table tbody tr.selectable:focus {
            -webkit-transform: scale(0.99,0.99);
                -ms-transform: scale(0.99,0.99);            
                    transform: scale(0.99,0.99);
        }

        #configurator .configurator-content table tbody tr.strikethrough {
            cursor: not-allowed;
            opacity: .3;
        }

        #configurator .configurator-content table tbody tr.required {
            color: red;
        }

        #configurator .configurator-content table tbody tr.strikethrough:hover {
            background: inherit;
        }

        #configurator .configurator-total table {
            width: 100%;
        }

        #configurator .configurator-total > table table td:first-child {
            padding-left: 60px;
        }

        #configurator .configurator-total > table,
        #configurator .configurator-total > table > tbody > tr > td {
            padding: 0;
            border: 0;
        }

        #configurator .configurator-total > table > tfoot td {
            background: #f2f2f2;
            padding: 10px;
        }

        #configurator .configurator-total > table table thead th:first-child,
        #configurator .configurator-total > table table tbody td:first-child,
        #configurator .configurator-total > table tfoot td:first-child {
            border-right: 30px solid #fff;
        }
body {
}

/*
    Contact page stylesheet

    @package Solvisoft
    @author Richard Mauritz
*/

.business-hours .box {
    border: 2px solid darken(#FAFBFC, 5%);
    padding: 25px 15px;
    margin-bottom: 15px;
    border-radius: 5px;
}

.box-out-of-container {
    position: absolute;
    z-index: 3;
    right: 0;
}

.box-out-of-container .box-out-of-container-content {
    background: @primary-color;
    color: #fff;
    padding: 15px 35px;
}

/* Custom ContactForm message */

.form-success-header {
    padding: 10px;
}
/*
    Content page stylesheet

    @package Solvisoft
    @author Richard Mauritz
    @since 18-10-2017
*/

#content {
    padding-bottom: 40px;
    padding-top:40px;

    a {
        color: @thirth-color;
    }
}
/*
    Customer user role stylesheet

    @package Solvisoft
    @author Richard Mauritz
    @since 27-10-2017
*/

#customerUserRole {
    #orderRegistration {
        background-color: #fff;
        padding: 15px;
        margin: 25px 0;

        .box-shadow(1px 1px 3px -1px #ccc);
    }
}
/*
    Stylesheet for error page

    @package Solvisoft
    @author Jan Konert
*/

.error-container {
    padding-top: 50px;
    padding-bottom: 50px;

    h3 {
        font-size:50px;
        margin-top: 0;
        font-weight: bold;
    }

    p {
        font-size: 30px;
        margin: 20px 0 50px;
    }

    i {
        font-size: 200px;
        color: @light-color;
    }
}

@media(max-width: 768px) {
    .error-container {
        padding-top: 20px;
        padding-bottom: 20px;

        h3  {
            font-size: 24px;
            font-weight: bold;
        }
        
        p {
            font-size: 20px;
            margin: 20px 0 50px;
        }

        i   {
            font-size:100px;
            margin-bottom:30px;
        }

    }
   
}

/*
    Favorites.less

    @package Solvisoft
    @author Richard Mauritz
*/

.btn-favorite {
    background-color: transparent;
    border: 0;
    padding: 0;
    outline: none;

    small,
    &:before {
        font-size: 13px;
    }

    small {
        padding-left: 5px;
    }
}

.btn-favorite.fa-star-o {
    color: @medium-gray-color;

    .transition(.33s);
}
.btn-favorite.fa-star {
    color: @fourth-color;
}

.btn-favorite:hover,
.btn-favorite:focus,
.btn-favorite:active {
    color: @fourth-color;

    .transition(.33s);
}
/*
    Homepage stylesheet

    @package Solvisoft
    @author Jan Konert
*/

#about-us {
    background-color: #f9f9f9;
}

#facts {
    background: @secondary-color;
    color: #fff;
}
/*
    News stylesheet

    @package Solvisoft
    @author Richard Mauritz
    @since 18-10-2017
*/

#news {
    padding-bottom: 40px;
}

.news-item {
    padding: 15px;

    a {
        display: block;
    }

    img {
        min-height: 200px;
        max-height: 200px;
        margin-left: auto;
	    margin-right: auto;
	    display: block;

        position: relative;

        .box-shadow(0 0 10px #ccc);

        &:after {
            position: absolute;
            content: " ";
            height: 100%;
            width: 100%;
            top: 0;
            left: 0;
        }
    }

    .news-item-title {
        padding: 15px;

        a {
            color: #000;
        }

        h2 {
            margin: 0;
            font-size: 18px;
            font-weight: bold;
        }
    }

    .news-item-content {
        padding: 0 15px;
    }

    .news-item-link {
        padding: 0 15px;
    }
}

/*
    News details stylesheet

    @package Solvisoft
    @author Richard Mauritz
    @since 10-10-2017
*/

.news-details {
    .news-content {
        padding: 15px 30px;
    }

    padding-bottom: 40px;
}
/*
    @package Solvisoft
    @author Jan Konert
*/

.news-page-item-wrapper {
    max-width: 800px;
    font-size: 18px;
}

.news-page-item-wrapper p {
    margin: 0 0 30px;
}

.news-page-detail-wrapper .news-detail-date {
    background-color: @fourth-color;
    display: inline-block;
    padding: 2px 10px;
    color: #ffffff;
    font-size: 15px;
    font-style: normal;
    margin: 20px 0;
    font-weight: bold;
}

.news-page-wrapper .news-page-item-wrapper h2 {
    color: @fourth-color;
    margin-bottom: 30px;
}



/*
    Order confirm page stylesheet

    @package Solvisoft
    @author Richard Mauritz
    @since 18-10-2017
*/

#OrderConfirm {
    .popover {
        min-width: 200px;
    }
}
/*
    Order payment page stylesheet

    @package Solvisoft
    @author Richard Mauritz
    @since 18-10-2017
*/

#OrderPayment {
    padding-top: 40px;
    padding-bottom: 40px;
}
@import "/content/Default/LESS/Views/Profile/profile.less";
/*
    Register stylesheet

    @package Solvisoft
    @author Richard Mauritz
    @since 11-12-2017
*/

.box {
    background: #fff;
    padding: 15px;
    border: 2px solid @light-gray-color;
    border-radius: @border-radius;
}

.choice {
    label {
        display: block;
        cursor: pointer;

        .transition(.33s);
    }

    input[type="radio"] {
        display: none;

        &:checked + label {
            border: 2px solid @thirth-color;

            .box-shadow(0 0 15px #ccc);
            .transition(.33s);
        }

        &:checked + .radio {
            border-color: @thirth-color;
        }

        &:hover + label {
            border: 2px solid @thirth-color;
            
            .transition(.33s);
        }
    }

    h3 {
        margin-top: 8px;
        font-weight: bold;
    }

    p {
        font-weight: normal;
    }
}
/*
    Item result filters stylesheets

    @package Solvisoft
    @author Richard Mauritz
*/

#filters .filter .filter-heading.collapsed {
    background: #f9f9f9;
}

#filters .filter .filter-heading {
    background: #f9f9f9;
    cursor: pointer;

    .filter-heading:active
        {
        background-color: red;
    }
}

#filters .filter:nth-child(-n+2) .filter-heading {
    background: @fourth-color;
}

#filters .filter .filter-heading h4 {
    margin: 0;
    padding: 10px;
    border-bottom: 1px solid #DBE3EE;
    font-size: 14px;
}

#filters .filter .filter-body .filter-type {
    display: block;
    padding: 10px;
    font-weight: normal;
}

/*
    Item result grid stylesheet

    @package Solvisoft
    @author Richard Mauritz
*/

[ng-webshop-grid] span,
[ng-webshop-grid] button {
    display: inline-block;
    vertical-align: middle;
}

[ng-webshop-grid] span {
    margin-right: 25px;
}

[ng-webshop-grid] .btn-grid {
    background: none;
    border: none;
    font-size: 32px;
    color: #dbe3ee;
    margin-top: 3px;
    padding: 0 0 0 10px;

    .hoverFade(.33s);
}

[ng-webshop-grid] .btn-grid:hover,
[ng-webshop-grid] .btn-grid:focus {
    color: lighten(@thirth-color, 60%);
    outline: none;

    .hoverFade(.33s);
}

[ng-webshop-grid] .btn-grid.active {
    color: @thirth-color;
}

.searchterm {
    color: @thirth-color;
    white-space: nowrap;
    margin-bottom: 5px;
}

.searchterm strong {
    position: relative;
    font-weight: normal;
    background: #dbe3ee;
    display: inline-block;
    padding: 0px 25px 2px 10px;
    border-radius: 12px;
    border: 1px solid @thirth-color;
    margin-left: 10px;
    top: -1px;

    span {
        font-size: 14px !important;
    }

    .fa {
        position: absolute;
        right: 5px;
        top: 4px;

        &:hover {
            opacity: 0.9;
            cursor: pointer;

            .hoverFade(.33s);
        }
    }
}

.searchterm-no-results {
    color: @fourth-color;
    white-space: nowrap;
}

[active-filters] {
    position: relative;
    margin-top: 5px;
    z-index: 10;
}

.search-suggestions .suggestions {
    display: block;
    padding: 0;
    margin: 0;
}

.search-suggestions .suggestions li {
    display: inline-block;
    border: 1px solid @thirth-color;
    padding: 10px;
    margin: 10px 5px 0 0;
    color: @thirth-color;
    font-weight: bold;
}

.search-suggestions .suggestions li:hover {
    cursor: pointer;
}

.item-results {
    display: block;
    color: #808080;
    font-size: 24px;
}

#items {
    margin-top: 10px;
}

#items .item-row,
#items .item-block {
    border: 1px solid #DBE3EE;
    margin-bottom: 10px;
}

#items .item-row:nth-child(even) {
    background: #f9f9f9;
}

#items .item-image  {

    height: 100px;
    padding-top:10px;

    img {
        max-width: 100%;
        max-height: 100px;
        margin-top:auto;
        margin-bottom:auto;
    }

}

#items .item-description {
    padding-top: 10px;
    max-height: 100px;
}

#items .item-price h3 {
    margin: 0;
}

#items .item-price h3 strong {
    font-size: 32px !important;
}

#items .item-description a {
    color: #000;
    font-size: 18px;
}

#items .item-block .item-link > a {
    font-size: 14px;
}

#items a {

    .hoverFade(.33s);
}

#items a:hover {
    color: lighten(@secondary-color, 20%);
    text-decoration: underline;

    .hoverFade(.33s);
}

#items .item-price h4 strong {
    font-size: 22px;
}

#items .item-basket input[type="number"] {
    background: #f9f9f9;
    border-color: #DBE3EE;
}

#items .item-basket button {
    font-size: 21px;
    padding: 5px 5px;
    height: 42px;
    line-height: 21px;
}


/*
    Rules to apply when layout breaks on particular widths
*/
@media screen and (min-width: 768px) , screen and (max-width: 1090px) {
    #items .item-description a {
        font-size: 14px;
    }
}
/*
    Rules for tablet screens
*/
@media (min-width: 768px) {

}

@media (max-width: 567px) {
    #items .input-group {
        max-width: 130px !important;
    }
}

/*
    Slider stylesheets

    @package Solvisoft
    @author Jan Konert
    @since 28-09-2017
    @editor Richard Mauritz
*/

#homeSlider .slider .carousel h1 {
    max-width: 700px;
    display: inline-block;
    font-size: 60px;
}

#homeSlider .carousel-caption .carousel-caption-inner p {
    color: #ffffff;
    font-size: 20px;
    max-width: 600px;
    display: inline-block;
}

#homeSlider .slider .carousel .btn-info {
    font-size: 20px;
}