/* ================================================================================
  Система: Impera CMS                                                             |
  Сайт системы: http://imperacms.com/                                              |
                                                                                  |
  Назначение файла: основные стили                                                |
  Расположение: http://сайт/design/папка_шаблона/css/style.css                    |
  Предназначен для шаблона: Minimalist                                            |
  Автор шаблона: Impera CMS                                                       |
                                                                                  |
  ------------------------------------------------------------------------------- |
                                                                                  |
  Impera CMS - лёгкий и мощнейший скрипт магазина с потрясающими возможностями.   |
  Здесь запросто получается то, что в конкурирующих продуктах требует усилий.     |
                                                                                  |
================================================================================ */



    /* ========== сброс стилей ========== */

    *, *:before, *:after {
        background: transparent;
        border: none;
        outline: none;
        color: inherit;
        font-family: Verdana, Tahoma, Arial;
        font-size: inherit;
        font-style: inherit;
        font-weight: inherit;
        margin: 0;
        padding: 0;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        position: relative;
    }

    script { display: none; }

    html,
    body {
        color: #333;
        font-size: 13pt;
    }

    h1 { font-size: 25pt; padding: 7px 0; }
    h2 { color: #a0a; font-size: 23pt; padding: 7px 0; }
    h3 { color: #a0a; font-size: 21pt; padding: 7px 0; }
    h4 { color: #a0a; font-size: 19pt; padding: 7px 0; }
    h5 { color: #a0a; font-size: 17pt; padding: 7px 0; }
    h6 { color: #a0a; font-size: 15pt; padding: 7px 0; }

    p {
        line-height: 1.45em;
        padding: 15px 0;
        text-indent: 30px;
    }
    .normal { font-size: 10pt; }

    textarea {
        height: 5.8em;
        resize: none;
    }

    b, strong { font-weight: bold; }
    i, em { font-style: italic; }

    a {
        cursor: pointer;
        color: #a0a;
        text-decoration: none;
    }

    a:hover {
        color: #0a0;
        text-decoration: underline;
    }

    .clear {
        clear: both;
        float: none;
    }

    .to-right {
        float: right;
    }



    /* ==================== сообщения ==================== */

    .error,
    .message,
    .noitems,
    .seo {
        background: #fbf;
        border: #eae 1px solid;
        border-radius: 4px;
        color: #a00;
        margin: 15px 50px;
        padding: 10px 20px;
        text-indent: 0;
    }

    .message {
        background: #bfb;
        border-color: #aea;
        color: #0a0;
    }

    .noitems {
        background: #ddd;
        border-color: #ccc;
        color: #777;
    }

    .seo {
        background: #ddd;
        border-color: #ccc;
        color: #777;
        font-size: 10pt;
        margin: 15px;
    }

    .pagination + .seo { margin-top: 25px; }
    .form-short + .seo { margin-top: 30px; }



    /* ==================== кнопка ==================== */

    .button {
        background: #0a0;
        border: 1px solid rgba(0, 0, 0, .15);
        border-radius: 4px;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .33),
                          0 2px 2px rgba(0, 0, 0, .33),
                          0 0 4px 1px rgba(0, 0, 0, .2);
        color: #fff;
        cursor: pointer;
        display: inline-block;
        margin: 10px;
        padding: 8px 15px;
        transition: all .3s ease-out;
        text-decoration: none;
        text-shadow: 0 0 25px rgba(0, 0, 0, .5);
        z-index: 2;
    }

    .button.reservation {
        background: #c22;
    }

    .button:hover,
    .button.reservation:hover {
        background: #a0a;
        color: #fff;
        text-decoration: none;
    }

    .button:after {
        background: linear-gradient(rgba(0, 0, 0, .1), rgba(0, 0, 0, 0));
        border-radius: 6px;
        box-shadow: inset 0 1px 0 rgba(0, 0, 0, .1),
                    inset 0 -1px 0 rgba(255, 255, 255, .7);
        content: '';
        position: absolute;
        top: -6px;
        right: -6px;
        bottom: -6px;
        left: -6px;
        z-index: -1;
    }

    .button.large {
        border-radius: 15px;
        color: #eee;
        font-size: 33pt;
        margin: 30px auto;
        padding: 15px 40px;
        text-shadow: 0 0 12px rgba(0, 0, 0, .25);
    }

    .button.large:after {
        border-radius: 20px;
    }

    .button.mini {
        font-size: 8pt;
        line-height: normal;
        padding: 3px 15px;
    }

    .button.disabled,
    .button.disabled:hover {
        background: #ccc;
        cursor: default;
    }

    .button.size1 { width: 85px; }
    .button.size2 { width: 125px; }



    /* ==================== поле ввода ==================== */

    .input {
        background: #fff;
        border: 1px solid rgba(0, 0, 0, .15);
        border-radius: 4px;
        color: #333;
        display: inline-block;
        margin: 10px;
        padding: 8px 15px;
        transition: all .3s ease-out;
        text-decoration: none;
        z-index: 2;
    }

    .input:after {
        background: linear-gradient(rgba(0, 0, 0, .1), rgba(0, 0, 0, 0));
        border-radius: 6px;
        box-shadow: inset 0 1px 0 rgba(0, 0, 0, .1),
                    inset 0 -1px 0 rgba(255, 255, 255, .7);
        content: '';
        position: absolute;
        top: -6px;
        right: -6px;
        bottom: -6px;
        left: -6px;
        z-index: -1;
    }

    .form-short .input {
        width: 225px;
    }

    .input.full {
        display: block;
        width: auto;
    }

        .input.full input,
        .input.full textarea {
            width: 100%;
        }

    .input.captcha {
        width: 80px;
    }

        .input.captcha + img {
            border: 1px solid rgba(0, 0, 0, .15);
            border-radius: 6px;
            display: inline-block;
            margin: 0 0 7px 10px;
            height: 46px;
            width: 90px;
            opacity: .85;
            vertical-align: bottom;
        }

    .input.cost {
        width: 120px;
    }

        .input.captcha input,
        .input.cost input {
            width: 100%;
        }



    /* ==================== отступы блоков ==================== */

    .listing + center,
    .pagination + center {
        margin-top: 30px;
    }

    .listing + .listing {
        margin-top: 20px;
    }

    .listing + .pagination {
        margin-top: 20px;
    }



    /* ==================== небольшая форма ввода ==================== */

    .noitems + .form-short,
    .pagination + .form-short,
    .banner + .form-short,
    center + .form-short {
        margin-top: 30px;
    }

    .form-short {
        border: #a7a 1px dashed;
        border-radius: 6px;
        display: block;
        margin: 10px auto;
        padding: 20px;
        width: 400px;
    }

        .form-short .button {
            float: right;
        }

        .form-short .hint {
            color: #aaa;
            display: block;
            font-size: 8pt;
            margin-left: 20px;
        }

        .form-short .hint + .input,
        .form-short .hint + .button,
        .form-short .hint + .input + .button,
        .form-short .hint + .input.captcha + img + .button,
        .form-short .input + .input.full {
            margin-top: 20px;
        }



    /* ==================== ремарка ==================== */

    .noitems + .remark,
    .pagination + .remark,
    .banner + .remark,
    center + .remark {
        margin-top: 30px;
    }

    .remark {
        border: #a7a 1px dashed;
        border-radius: 4px;
        display: block;
        margin: 10px 15px;
        padding: 20px;
    }

        .remark p,
        .remark li {
            font-size: 10pt;
            line-height: 1.65em;
        }

        .remark strong {
            font-size: 13pt;
        }

        .remark ul {
            margin-left: 80px;
        }



    /* ==================== история поиска ==================== */

    .history {
        border: #a7a 1px dashed;
        border-radius: 6px;
        display: block;
        margin: 40px 20px 0 20px;
        padding: 20px;
    }

        .history strong {
            display: block;
            font-size: 19pt;
            font-weight: normal;
            margin-bottom: 10px;
        }

        .history .hint {
            color: #aaa;
            display: block;
            font-size: 8pt;
            margin-top: 10px;
        }

        .history a {
            background: #eee;
            border: 1px solid rgba(0, 0, 0, .15);
            border-radius: 18px;
            box-shadow: 0 0 20px rgba(255, 255, 255, 1) inset;
            color: #0a0;
            display: inline-block;
            height: 36px;
            line-height: 35px;
            margin: 1% 1.5%;
            padding: 0 20px;
            width: 47%;
            white-space: nowrap;
            overflow: hidden;
            text-decoration: none;
            z-index: 2;
        }

        .history a:hover {
            color: #a0a;
        }

        .history a:before {
            background: #a0a;
            border-radius: 8px;
            content: '';
            display: inline-block;
            float: left;
            margin: 9px 8px 0 -10px;
            height: 16px;
            width: 16px;
        }

        .history a:after {
            background: linear-gradient(rgba(0, 0, 0, .1), rgba(0, 0, 0, 0));
            border-radius: 16px;
            content: '';
            position: absolute;
            top: 1px;
            right: 1px;
            bottom: 1px;
            left: 1px;
            z-index: -1;
        }

    .history + form {
        display: none;
    }



    /* ==================== список мини карточек ==================== */

    .listing {
        padding-left: 20px;
        width: 100%;
        overflow: hidden;
    }



    /* ==================== мини карточка категории ==================== */

    .category {
        background: #eee;
        border: #fff 10px solid;
        float: left;
        height: 200px;
        width: 33.333333%;
        overflow: hidden;
    }

        .category .count {
            background: #0a0;
            color: #ccc;
            display: block;
            float: right;
            font-size: 8pt;
            height: 20px;
            line-height: 20px;
            overflow: hidden;
            padding: 0 5px 0 10px;
        }

        .category > a {
            background: #0a0;
            color: #fff;
            display: block;
            font-size: 8pt;
            font-weight: bold;
            height: 20px;
            line-height: 20px;
            padding: 0 0 0 10px;
            overflow: hidden;
        }

        .category .image {
            height: 140px;
            margin: 10px;
            overflow: hidden;
        }

            .category .image img {
                min-height: 140px;
                width: 100%;
            }



    /* ==================== мини карточка ==================== */

    .item {
        background: #fff;
        border-radius: 15px 0 0 15px;
        color: #888;
        line-height: 25px;
        height: 150px;
        margin: 20px 0;
        padding: 0 10px 0 0;
        overflow: hidden;
    }

        .item .image {
            border-radius: 15px 0 0 15px;
            float: left;
            margin-right: 20px;
            height: 150px;
            width: 150px;
            overflow: hidden;
        }

            .item .image img {
                border-radius: 15px 0 0 15px;
                min-height: 150px;
                width: 100%;
            }

        .item a {
            display: block;
            font-size: 15pt;
            line-height: 30px;
            margin: 4px 0 10px 0;
        }



    /* ==================== страница товара ==================== */

    .product {
    }

        .product img,
        .product video,
        .product object,
        .product iframe {
            max-width: 704px;
        }

        .product .image {
            background: #fff;
            border-top: #a0a 3px solid;
            border-bottom: #a0a 3px solid;
            margin: 15px 0;
            overflow: hidden;
        }

            .product .image img {
                display: block;
                margin: 0 auto;
                width: auto;
            }

            .product .image > span,
            .product .image > i {
                background: #fff;
                height: 25px;
                line-height: 25px;
                padding: 0 10px;
                text-align: right;
                position: absolute;
                top: 0;
                left: 60%;
                right: 0;
                overflow: hidden;
                opacity: .5;
            }
            .product .image > i {
                font-style: normal;
                text-align: left;
                left: 0;
                right: 60%;
            }
            .product .image > span + span { margin-top: 26px; }
            .product .image > i + i { margin-top: 26px; }
            .product .image > i + i + i { margin-top: 52px; }
            .product .image > i + i + i + i { margin-top: 78px; }
            .product .image > i + i + i + i + i { margin-top: 104px; }
            .product .image > i + i + i + i + i + i { margin-top: 130px; }
            .product .image > i + i + i + i + i + i + i { margin-top: 156px; }
            .product .image > i + i + i + i + i + i + i + i { margin-top: 182px; }
            .product .image > i + i + i + i + i + i + i + i + i { margin-top: 208px; }
            .product .image > i + i + i + i + i + i + i + i + i + i { margin-top: 234px; }
            .product .image > i + i + i + i + i + i + i + i + i + i + i { margin-top: 260px; }
            .product .image > i + i + i + i + i + i + i + i + i + i + i + i { margin-top: 286px; }
            .product .image > i + i + i + i + i + i + i + i + i + i + i + i + i { margin-top: 312px; }
            .product .image > i + i + i + i + i + i + i + i + i + i + i + i + i + i { margin-top: 338px; }
            .product .image > i + i + i + i + i + i + i + i + i + i + i + i + i + i + i { margin-top: 364px; }
            .product .image > i + i + i + i + i + i + i + i + i + i + i + i + i + i + i + i { display: none; }



    /* ==================== фото галерея ==================== */

    .gallery {
        background: #a0a;
        margin: -66px 0 15px 0;
        padding: 10px 0;
        text-align: center;
        white-space: nowrap;
        opacity: .5;
    }

    .gallery:hover {
        opacity: 1;
    }

        .gallery > div {
            border: #fff 1px solid;
            cursor: pointer;
            display: inline-block;
            margin: 0 5px;
            height: 80px;
            width: 80px;
            overflow: hidden;
        }

            .gallery > div img {
                display: block;
                min-height: 80px;
                width: 100%;
            }

        .gallery > div + div + div + div + div + div + div + div {
            display: none;
        }



    /* ==================== пагинатор страниц ==================== */

    .pagination {
        background: #a0a;
        border-radius: 4px;
        margin: 10px 0;
        padding: 5px;
        height: 50px;
        line-height: 40px;
        width: 100%;
        white-space: nowrap;
        overflow: hidden;
    }

        .pagination a {
            background: #fff;
            border-radius: 50%;
            display: block;
            float: left;
            margin: 0 4px 0 5px;
            height: 40px;
            line-height: 40px;
            width: 40px;
            text-align: center;
        }

        .pagination a:hover {
            background: #0a0;
            color: #fff;
            text-decoration: none;
        }

        .pagination a + a + a + a + a + a + a + a + a + a + a + a + a + a {
            display: none;
        }

        .pagination .current {
            color: #666;
        }

        .pagination .next {
            display: block;
        }



    /* ==================== баннер ==================== */

    .banner {
        margin-bottom: 10px;
        overflow: hidden;
    }

        .banner .title {
            background: #808;
            color: #f5f;
            padding: 3px 10px 5px 10px;
        }

        .banner img {
            display: block;
            width: 100%;
        }

        .banner .price {
            position: absolute;
            color: #a0a;
            font-size: 19pt;
            top: 50px;
            right: 30px;
        }

        .banner .button {
            position: absolute;
            bottom: 60px;
            right: 25px;
        }

        .banner .descr {
            background: #808;
            color: #f5f;
            font-size: 8pt;
            padding: 4px 10px 6px 10px;
        }

        .banner.services > div + div:before {
            content: 'Вот ещё пример';
            background: #a0a;
            color: #eee;
            display: block;
            margin: 30px 0;
            padding: 5px 10px;
        }

        .banner.miscellaneous > div + div:before {
            content: '';
            background: #a0a;
            display: block;
            height: 1px;
            margin-top: 30px;
        }

        .banner.miscellaneous img {
            border: #fff 20px solid;
            border-radius: 10px;
            margin: 30px auto 0 auto;
            width: auto;
            max-width: 704px;
        }

        .banner h6 {
            border-top: #a0a 3px solid;
            margin-top: 50px;
        }

        .banner h6 + p + div {
            margin-top: 15px;
        }



    /* ==================== блок чего-либо ==================== */

    .box {
        margin-bottom: 10px;
    }

        .box h6 {
            border-top: #a0a 3px solid;
            margin-top: 50px;
        }

        .box h6 + p + div {
            margin-top: 15px;
        }



    /* ==================== блок "дополнительно" ==================== */

    .more.minimized {
        background: #c3c;
        border: #a0a 100px solid;
        border-top-width: 20px;
        border-bottom-width: 20px;
        margin: 80px 0 30px 0;
        text-align: center;
    }

    .more.minimized + .more.minimized {
        margin-top: 120px;
    }

    .more.minimized:before {
        background: #808;
        color: #eee;
        content: attr(data-title);
        display: block;
        height: 30px;
        line-height: 30px;
        margin: -50px -100px 0 -100px;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
    }

    .more.minimized:after {
        background: #909;
        color: #f5f;
        content: attr(data-hint);
        display: block;
        font-size: 8pt;
        height: 30px;
        line-height: 30px;
        margin: 0 -100px -50px -100px;
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
    }

        .more.minimized > div,
        .more.minimized > p {
            display: none;
        }

        .more.minimized > .button.large {
            display: inline-block;
        }

        .more > .button.large {
            display: none;
        }



    /* ==================== обертка ==================== */

    html { background: #a0a; }
    body { background: #fbf; }

    body:before {
        background: #a0a;
        border-bottom: #909 25px solid;
        outline: #808 25px solid;
        content: '';
        height: 110px;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        z-index: 1;
    }

    body:after {
        background: #808;
        border-top: #909 25px solid;
        content: '';
        height: 65px;
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 1;
    }

    #wrapper {
        background: #eee;
        border-right: #eee 10px solid;
        box-shadow: #a0a 0 0 25px;
        margin: 0 auto;
        padding: 0 20px;
        width: 1024px;
    }

        #wrapper > div {
            z-index: 2;
        }

    #wrapper:before {
        background: #fbf;
        border-right: #eee 40px solid;
        box-shadow: #a0a 0 0 25px inset;
        content: '';
        margin-left: -100%;
        width: 100%;
        position: absolute;
        top: 0;
        bottom: -0;
        z-index: 0;
    }



    /* ==================== шапка ==================== */

    #header {
        color: #eee;
        font-size: 81px;
        height: 110px;
        margin-bottom: 40px;
        white-space: nowrap;
    }

    #header:after {
        color: #f5f;
        content: attr(data-hint);
        display: block;
        font-size: 8pt;
        line-height: 30px;
        height: 27px;
        text-align: center;
    }

        #header > .button:not(.mini) {
            font-size: 13pt;
            margin: 48px -5px 0 0;
            position: absolute;
            top: 0;
            right: 0;
        }

        #header > .button.mini {
            background: #b9b;
            position: absolute;
            margin: 10px -5px 0 0;
            top: 0;
            right: 0;
        }

        #header > .button.mini + .button.mini {
            right: 90px;
        }

        #header > a:not(.button) {
        }

            #header > a img {
                border-radius: 5px;
                height: 80px;
                margin: 17px 0 -5px 0;
            }

        #header > a:not(.button):before {
            background: linear-gradient(rgba(0, 0, 0, .1), rgba(255, 0, 255, .2));
            border-radius: 7px;
            box-shadow: inset 0 1px 0 rgba(0, 0, 0, .1),
                        inset 0 -1px 0 rgba(255, 0, 255, .2);
            content: '';
            position: absolute;
            top: 0;
            right: -6px;
            bottom: 5px;
            left: -6px;
            z-index: 0;
        }



    /* ==================== верхнее меню ==================== */

    #menu {
        border-bottom: #a0a 3px solid;
        height: 33px;
        line-height: 25px;
        margin: -7px 0 15px 0;
        overflow: hidden;
    }

        #menu a {
            color: #0a0;
            margin-right: 40px;
            white-space: nowrap;
        }



    /* ==================== левая колонка ==================== */

    #left {
        border-right: #a0a 3px solid;
        float: left;
        padding: 0 15px 15px 0;
        width: 255px;
    }

        #left .button {
            margin-left: -8px;
        }

        #left .button + .button {
            float: right;
            margin-left: 0;
            margin-right: 2px;
        }

        #left ul + .button {
            margin-top: 30px;
        }

        #left ul {
            margin-left: 5px;
            overflow: hidden;
        }

            #left ul ul {
                margin: 10px 0 0 10px;
            }

                #left ul ul a,
                #left ul + .button + ul a {
                    color: #333;
                }

                #left .active > a {
                    background: #a0a;
                    border-radius: 3px;
                    color: #fff;
                    display: block;
                    margin-left: -5px;
                    padding: 0 5px 3px 5px;
                }

                    #left .active .active > a {
                        background: #0a0;
                    }

            #left li {
                border-left: #0a0 1px solid;
                display: block;
                padding: 5px 0 5px 20px;
            }

            #left li:before {
                background: #0a0;
                content: '';
                display: block;
                height: 1px;
                width: 15px;
                position: absolute;
                top: 15px;
                left: 0;
            }

            #left li:last-child:before {
                background: #eee;
                border-top: #0a0 1px solid;
                content: '';
                display: block;
                height: 10000px;
                width: 16px;
                position: absolute;
                top: 15px;
                left: -1px;
            }

        #left .count {
            color: #aaa;
            float: right;
            font-size: 8pt;
            margin: 4px 0 0 10px;
            white-space: nowrap;
        }

            #left .active > .count {
                color: #ccc;
                margin-right: 5px;
                z-index: 1;
            }



    /* ==================== центральная часть ==================== */

    #center {
        border-left: #a0a 3px solid;
        min-height: 400px;
        margin-left: 252px;
        padding: 0 0 15px 15px;
    }



    /* ==================== release candidate ==================== */

    #rc {
        background: #c22;
        border-radius: 2px;
        color: #fff;
        font-size: 8pt;
        margin-top: 20px;
        padding: 15px;
        text-align: center;
    }

    .bonus {
        background: #0a0;
        border-radius: 2px;
        color: #fff;
        font-size: 8pt;
        padding: 15px;
        text-align: center;
        text-indent: 0;
    }



    /* ==================== подвал ==================== */

    #footer {
        color: #ddd;
        clear: both;
        line-height: 30px;
        margin-top: 20px;
        padding-bottom: 6px;
        z-index: 1;
    }

    #footer:before {
        color: #f5f;
        content: attr(data-hint);
        display: block;
        font-size: 8pt;
        line-height: 27px;
        height: 30px;
        text-align: center;
    }

        #footer .counters,
        #footer .counters * {
            background: transparent  !important;
            border: none !important;
            outline: none !important;
            display: inline-block;
            height: 1px !important;
            min-height: none !important;
            width: 1px !important;
            min-width: none !important;
            overflow: hidden !important;
            position: relative !important;
            opacity: .0001 !important;
        }

        #footer .button {
            margin: 35px -5px 0 0;
            position: absolute;
            top: 0;
            right: 0;
        }

        #footer .cms {
            color: #a5a;
            font-size: 8pt;
            position: absolute;
            top: 30px;
            right: 100px;
        }

            #footer .cms a {
                color: #a5a;
            }
