﻿/* Марка, Модель и Товар */

.product {
    width: 180px;
    height: 180px;
    border: 1px solid #666;
    position: relative;
    margin-right: -1px;
    margin-bottom: -1px;
    /*background: #EBEBEB;
    border: 1px solid #CFCFCF;
    font-weight: bold;
    height: 120px;
    width: 120px;*/
    float: left;
    color: #555;
    text-align: center;
    line-height: 20px;
    margin: 0px 6px 4px 6px;
}
.product__inner {
    position: absolute;
    min-width: 100%;
    min-height: 100%;
    padding: 8px;
    background-color: #fff;
}
.product__inner:before {
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    box-shadow: 0px 0px 10px rgba(0,0,0,0.6);
    opacity: 0;
    transition: opacity .3s;
    left: 0;
    top: 0;
    z-index: 1;
}
.product__image {
    text-align: center;
}
.product__name {
    font-weight: bold;
    /*margin: .3em 0 .5em;*/
}
.product__price {
    font-size: 11px;
    /*font-weight: lighter;*/
    /*margin: .3em 0 .5em;*/
}
.product__content {
    max-height: 15px;
    overflow: hidden;
    transition: max-height .3s;
}
.product:hover {
    z-index: 1;
}
.product:hover .product__content {
    max-height: 100px;
}
.product:hover .product__inner:before {
    opacity: 1;
}
/* Партия */

.party {
    width: 195px;
    height: 85px;
    border: 1px solid #666;
    position: relative;
    margin-right: -1px;
    margin-bottom: -1px;
    /*background: #EBEBEB;
    border: 1px solid #CFCFCF;
    font-weight: bold;
    height: 120px;
    width: 120px;*/
    float: left;
    color: #555;
    text-align: center;
    line-height: 20px;
    margin: 0px 6px 4px 6px;
}
.party__inner {
    position: absolute;
    min-width: 100%;
    min-height: 100%;
    padding: 8px;
    background-color: #fff;
}
.party__inner:before {
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    box-shadow: 0px 0px 10px rgba(0,0,0,0.6);
    opacity: 0;
    transition: opacity .3s;
    left: 0;
    top: 0;
    z-index: 1;
}
.party__image {
    text-align: center;
}
.party__name {
    font-weight: bold;
    /*margin: .3em 0 .5em;*/
}
.party__char {
    font-size: 11px;
    color: #A9A9A9;
}
.party__price {
    font-size: 11px;
    /*font-weight: lighter;*/
    /*margin: .3em 0 .5em;*/
}
.party__content {
    max-height: 15px;
    overflow: hidden;
    transition: max-height .3s;
}
.party:hover {
    z-index: 1;
}
.party:hover .party__content {
    max-height: 100px;
}
.party:hover .party__inner:before {
    opacity: 1;
}
/* Каталог */
.toolbar-btn-RetailCafe-Catalog-cls {
    background-image: none;
    background-color: #fc3 !important;
}



/*Наведение мышки*/
.toolbar-btn-RetailCafe-Catalog-cls-hover {
    /*background: url(../img/button_bg.png) no-repeat !important;*/
    background-color: #ff8a8a !important;
    background-image: none;
}

/* ToolBar: Номенклатура */
.toolbar-btn-RetailCafe-Nomenclature-cls {
    background-image: none;
    background-color: #fc3 !important;
}
/*Наведение мышки*/
.toolbar-btn-RetailCafe-Nomenclature-cls-hover {
    /*background: url(../img/button_bg.png) no-repeat !important;*/
    background-color: #A0BBFA !important;
    background-image: none;
}








    /* === blue === */

    .ui-tab-style-blue a.x-tab {
        overflow: visible;
        border-style: none;
        padding-left: 18px;
        padding-right: 6px;
        background-color: transparent !important;
        box-shadow: none !important;
    }

    .ui-tab-style-blue a.x-tab .x-tab-close-btn {
        /*top: 4px;
        right: 6px;*/
    }


    /*Цвет текста НЕ активной вкладки*/
    .ui-tab-style-blue a.x-tab .x-tab-inner {
        /*color: #00638e;*/
        color: white;
    }

    .ui-tab-style-blue a.x-tab::before {
        content: '';
        position: absolute;
        top: 0;
        left: 6px;
        width: 65%;
        height: 100%;
        background-color: #6b6b70;
        transform: skewX(-20deg);
        border-radius: 8px 0 0 0;
        z-index: -1;
        box-shadow: -1px 0 1px 0 rgba(0,0,0,0.5);
    }

    .ui-tab-style-blue a.x-tab::after {
        content: '';
        position: absolute;
        top: 0;
        right: -6px;
        width: 70%;
        height: 100%;
        background-color: #6b6b70;
        transform: skewX(20deg);
        border-radius: 0 8px 0 0;
        z-index: -2;
    }


    /*Цвет текста Активной вкладки*/
    .ui-tab-style-blue .x-tab.x-tab-active.x-tab-default .x-tab-inner-default {
        color: white;
    }

    .ui-tab-style-blue a.x-tab.x-tab-active::before,
    .ui-tab-style-blue a.x-tab.x-tab-active::after {
        background-color: #00000d;
    }











/* === green === */

.ui-tab-style-green a.x-tab {
    overflow: visible;
    border-style: none;
    padding-left: 18px;
    padding-right: 6px;
    background-color: transparent !important;
    box-shadow: none !important;
}

.ui-tab-style-green a.x-tab .x-tab-inner {
    /*color: #00638e;*/
    color: white
}

.ui-tab-style-green a.x-tab .x-tab-close-btn {
    /*top: 4px;
    right: 6px;*/
}

    .ui-tab-style-green a.x-tab::before {
        content: '';
        position: absolute;
        top: 0;
        left: 6px;
        width: 65%;
        height: 100%;
        background-color: #6b6b70;
        transform: skewX(-20deg);
        border-radius: 8px 0 0 0;
        z-index: -1;
        box-shadow: -1px 0 1px 0 rgba(0,0,0,0.5);
    }

    .ui-tab-style-green a.x-tab::after {
        content: '';
        position: absolute;
        top: 0;
        right: -6px;
        width: 70%;
        height: 100%;
        background-color: #6b6b70;
        transform: skewX(20deg);
        border-radius: 0 8px 0 0;
        z-index: -2;
    }

    .ui-tab-style-green a.x-tab.x-tab-active::before,
    .ui-tab-style-green a.x-tab.x-tab-active::after {
        background-color: #00000d;
    }








/* === red === */

.ui-tab-style-red a.x-tab {
    overflow: visible;
    border-style: none;
    padding-left: 18px;
    padding-right: 6px;
    background-color: transparent !important;
    box-shadow: none !important;
}

.ui-tab-style-red a.x-tab .x-tab-inner {
    /*color: #00638e;*/
    color: white
}

.ui-tab-style-red a.x-tab .x-tab-close-btn {
    /*top: 4px;
    right: 6px;*/
}

    .ui-tab-style-red a.x-tab::before {
        content: '';
        position: absolute;
        top: 0;
        left: 6px;
        width: 65%;
        height: 100%;
        background-color: #6b6b70;
        transform: skewX(-20deg);
        border-radius: 8px 0 0 0;
        z-index: -1;
        box-shadow: -1px 0 1px 0 rgba(0,0,0,0.5);
    }

    .ui-tab-style-red a.x-tab::after {
        content: '';
        position: absolute;
        top: 0;
        right: -6px;
        width: 70%;
        height: 100%;
        background-color: #6b6b70;
        transform: skewX(20deg);
        border-radius: 0 8px 0 0;
        z-index: -2;
    }

    .ui-tab-style-red a.x-tab.x-tab-active::before,
    .ui-tab-style-red a.x-tab.x-tab-active::after {
        background-color: #00000d;
    }











/* Window Header Color */

.ui-win-style-blue .x-window-header {
    background-color: #00000d;
    padding: 5px;
}








/* ToolBar: Other */
.ui-button-Other-cls {
    background-image: none;
}
/*Наведение мышки*/
.ui-button-Other-cls-hover {
    /*background: url(../img/button_bg.png) no-repeat !important;*/
    background-color: #00000d !important;
    background-image: none;
}
.ui-button-Other-cls-hover .x-btn-inner {
    color: white;
}