/*VARIABLES*/


@headerFont: @mainFont;

/*Colors*/
@mainColorLight: lighten(@mainColor, 5%);
@mainColorBright: lighten(@mainColor, 35%);

@mainColorLimb: fadeout(@mainColor, 80%);
@mainColorDarken: darken(@mainColor, 5%);
@mainColorSaturate: saturate(@mainColorDarken, 30%);

@bgInverse: lighten(spin(@mainColor, 195%), 40%);

/*addColor lighten*/
@addColorLight5: lighten(@addColor, 5);
@addColorLight10: lighten(@addColor, 10);

/*mainColor lighten*/
@mainColorLight10: lighten(@mainColor, 10%);
@mainColorLight20: lighten(@mainColor, 20%);
@mainColorLight30: lighten(@mainColor, 30%);
@mainColorLight40: lighten(@mainColor, 40%);
@mainColorLight45: lighten(@mainColor, 45%);
@mainColorLight50: lighten(@mainColor, 50%);
@mainColorLight60: lighten(@mainColor, 60%);
@mainColorLight70: lighten(@mainColor, 70%);
@mainColorLight80: lighten(@mainColor, 80%);

/*mainColor transparency*/
@mainColorFadeout10: fadeout(@mainColor, 10%);
@mainColorFadeout20: fadeout(@mainColor, 20%);
@mainColorFadeout30: fadeout(@mainColor, 30%);
@mainColorFadeout40: fadeout(@mainColor, 40%);
@mainColorFadeout50: fadeout(@mainColor, 50%);
@mainColorFadeout60: fadeout(@mainColor, 60%);
@mainColorFadeout70: fadeout(@mainColor, 70%);
@mainColorFadeout80: fadeout(@mainColor, 80%);
@mainColorFadeout90: fadeout(@mainColor, 90%);
@mainColorFadeout95: fadeout(@mainColor, 95%);

/*addColor spin*/
@addColorLighten10Spin5: spin(@addColorLight10, 5);


@red: #da251d;
@magenta: #e81d62;
@black: #363636;

@darkGrey: #525252;
@mediumGrey: #898989;
@lightGrey: #f5f5f5;
@brightGrey: #efefef;

/*END VARIABLES*/


html {
    position: relative;
    min-height: 100%;
}
body {
    margin: 0;
    padding: 47px 0 0;
    font-weight: normal;
    font-size: @mainFontSize + 0px;
    font-family: @mainFont, sans-serif;
    line-height: @mainFontSize + @mainFontSize/2 + 0px;
    color: @black;
}

strong,
.bold{
    font-weight: bold;
}
.h2.bold,
.h3.bold,
.h4.bold,
.h5.bold{
    font-family: @headerFont;
    font-weight: normal;
}


i, .italic{
    font-style: italic;
}

h1, h2, h3, h4, h5,
.h1, .h2, .h3, .h4, .h5 {
    font-family: @headerFont;
    color: @black;
}

h1, .h1{
    font: bold 26px/30px @headerFont;
    margin: 0 0 25px;
}
h2, .h2{
    font: bold 24px/25px @headerFont;
    margin: 25px 0;
}
h3, .h3{
    font: bold 20px/25px @headerFont;
    margin: 15px 0;
}
h4, .h4{
    font: 500 18px/22px @headerFont;
    margin: 15px 0;
}
h5, .h5{
    font: 500 16px/20px @headerFont;
    margin: 15px 0;
}

*>h2:first-child, *>.h2:first-child,
*>h3:first-child, *>.h3:first-child,
*>h4:first-child, *>.h4:first-child{
    margin-top: 0;
}
hr{
    height: 1px;
    border: none;
    background: @lightGrey;
    margin-bottom: 15px;
}

p{
    margin: 0 0 10px 0;
}


/*GRID*/
@media (min-width: 1200px) {
  .container,
  .container-sm,
  .container-md,
  .container-lg,
  .container-xl {
    max-width: @siteWidth;
  }
}
/*END GRID*/


/*LINKS*/
a {
    color: @mainColor;
    text-decoration: none;
    transition: all .04s ease-out .04s;
}
a:before,
a:after{
    transition: all .04s ease-out .04s;
}
a:hover {
    color: darken(saturate(@mainColor, 50%), 12);
    text-decoration: none;
}
.dotted{
    border-bottom: 1px dotted @mainColor;
}
.dotted:hover{
    border-bottom: 1px dotted transparent;
}
.text-dashed,
.dashed{
    color: @mainColor;
    text-decoration: none;
    border-bottom: 1px dashed @mainColor;
}
.text-dashed:hover,
.dashed:hover{
    border-bottom-color: @mainColor;
}

.dashed.red{
    border-bottom: 1px dashed @red;
}
.dashed.red:hover{
    border-bottom-color: darken(@red, 5%);
}

.dashed.text-lightgrey{
    border-bottom-color: @lightGrey;
}
.dashed.text-lightgrey:hover{
    color: @brightGrey;
    border-bottom-color: @brightGrey;
}

.dashed.text-darkgrey{
    border-bottom-color: @darkGrey;
}
.dashed.text-darkgrey:hover{
    border-bottom-color: @black;
}
.strikethrough{
    position: relative;
    display: inline-block;
}

.strikethrough:before{
    position: absolute;
    content: '';
    top: 50%;
    left: -2px;
    right: -2px;
    height: 1px;
    background: @darkGrey;
}
.text-mediumgrey .strikethrough:before,
.text-mediumgrey.strikethrough:before{
    background: @mediumGrey;
}
/*END LINKS*/


/*COLORS*/
.bg-white{
    background-color: #fff;
}
.bg-lightgrey{
    background-color: @lightGrey !important;
}
.bg-brightgrey{
    background-color: @brightGrey !important;
}
.bg-inverce{
    background-color: @bgInverse !important;
}
.bg-maincolor{
    background-color: @mainColor !important;
}
.bg-maincolorbright{
    background-color: @mainColorBright;
}
.bg-maincolorlimb{
    background-color: @mainColorLimb;
}
.red,
.red *,
.availability-list-amount{
    color: @red !important;
    fill: @red;
}
a.red:hover,
a.red:hover *{
    color: darken(@red, 5%) !important;
    fill: darken(@red, 5%) !important;
}
.maincolor,
.text-maincolor{
    color: @mainColor;
}
.text-addcolor{
    color: @addColor;
}
.text-white{
    color: #fff !important;
}
.text-darkgrey,
.text-darkgrey a{
    color: @darkGrey !important;
}
.text-mediumgrey{
    color: @mediumGrey !important;
}
.text-lightgrey{
    color: @lightGrey !important;
}
.text-brightgrey{
    color: @brightGrey !important;
}
a.text-darkgrey:hover,
.text-darkgrey a:hover,
.text-darkgrey a.active{
    color: @black !important;
}
.border-lightgrey{
    border: 1px solid @lightGrey;
}
.border-maincolor{
    border: 1px solid @mainColor;
}
.main-gradient{
    background-color: @mainColor;
    background: -moz-linear-gradient(top, @addColor, @mainColor);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,@addColor), color-stop(100%@mainColor));
    background: -webkit-linear-gradient(top, @addColor,@mainColor);
    background: -o-linear-gradient(top, @addColor, @mainColor);
    background: -ms-linear-gradient(top, @addColor,@mainColor);
    background: linear-gradient(top, @addColor, @mainColor);
}
.additional-gradient{
    background-color: @gradientStartColor;
    background: -moz-linear-gradient(left, @gradientStartColor, @gradientEndColor);
    background: -webkit-gradient(linear, left, right, color-stop(0%,@gradientStartColor), color-stop(100%,@gradientEndColor));
    background: -webkit-linear-gradient(left, @gradientStartColor, @gradientEndColor);
    background: -o-linear-gradient(left, @gradientStartColor, @gradientEndColor);
    background: -ms-linear-gradient(left, @gradientStartColor, @gradientEndColor);
    background: linear-gradient(left, @gradientStartColor, @gradientEndColor);
}
.additional-gradient-vertical{
    background-color: @gradientStartColor;
    background: -moz-linear-gradient(top, @gradientEndColor, @gradientStartColor);
    background: -webkit-gradient(linear, top, bottom, color-stop(0%,@gradientEndColor), color-stop(100%,@gradientStartColor));
    background: -webkit-linear-gradient(top, @gradientEndColor, @gradientStartColor);
    background: -o-linear-gradient(top, @gradientEndColor, @gradientStartColor);
    background: -ms-linear-gradient(top, @gradientEndColor, @gradientStartColor);
    background: linear-gradient(top, @gradientEndColor, @gradientStartColor);
}
.block-top-gradient{
    background-color: #fff;
    background: -moz-linear-gradient(top, #f8f8f8, #fff);
    background: -webkit-gradient(linear, left, right, color-stop(0%,#f8f8f8), color-stop(100%,#fff));
    background: -webkit-linear-gradient(top, #f8f8f8, #fff);
    background: -o-linear-gradient(top, #f8f8f8, #fff);
    background: -ms-linear-gradient(top, #f8f8f8, #fff);
    background: linear-gradient(top, #f8f8f8, #fff);
}
/*END COLORS*/


/*HEADER*/
html.u-eip .top-panel{
    top: 38px;
}
header a,
header a:hover{
    text-decoration: none;
}
.header{
    padding: 25px 0 25px;
}

/*TOP-PANEL*/
.top-panel{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 102;
    text-align: center;
    box-shadow: 0 1px 1px rgba(255,255,255,.3);
    .additional-gradient;
}
.top-panel-row{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.top-panel ul:not(.menu-mobile)>li{
    margin-right: 1px;
    display: inline-block;
}
.top-panel-menu{
    display: inline-block;
}
.top-panel-menu__item{
    position: relative;
    height: 47px;
    line-height: 47px;
}
.top-panel-menu-item__pict{
    display: inline-block;
    line-height: 13px;
    vertical-align: middle;
    svg{
        fill: #fff;
    }
}
.top-panel-menu-item__title{
    display: none;
    margin-left: 10px;
    vertical-align: middle;
    font: 13px/13px @mainFont;
    color: #fff;
}
.top-panel-menu-item{
    display: block;
    padding: 0 10px;
    font-size: 14px;
}
.top-panel-menu-item:hover{
    background: @mainColorSaturate;
}
.top-panel-address{
    display: none;
    padding: 0 18px;
    font: bold 13px/13px @mainFont;
    color: #fff;
}
.tabs-general>li>a:after,
.service-item-wrapper:after{
    display: block;
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: -3px;
    height: 3px;
    opacity: 0;
    background: @red;
    transition: all .2s ease-out .2s;
}
.main-menu-tabs-btns>div>a.active:after,
.main-menu-tabs-btns>div>a:hover:after,
.tabs-general>li>a.active:after,
.tabs-general>li>a:hover:after,
.service-items>li:hover:after{
    bottom: 0;
    opacity: 1;
}

/*Basket count*/
.basket-counter{
    display: inline-block;
    min-width: 26px;
    height: 26px;
    border-radius: 50%;
    margin-left: 8px;
    font-size: 0;
    line-height: 26px;
    text-align: center;
    background: @red;
    vertical-align: middle;
}
.basket-counter span{
    z-index: 2;
    display: inline-block;
    padding: 0 4px;
    font: bold 11px/11px @mainFont;
    color: #fff;
    vertical-align: middle;
}
/*End basket count*/

/*END TOP-PANEL*/


/*HEADER MIDDLE*/
.header-middle-block{
    display: flex;
    flex-wrap: wrap;
}
.header-middle-block__logo,
.header-middle-block__search,
.header-middle-block__contacts{
    margin-bottom: 10px;
    flex: 0 0 100%;
    max-width: 100%;
}


/*MAIN MENU BTN*/
.hamburger{
    display: inline-block;
    width: 30px;
    margin: 11px 0 10px;
}
.hamburger span{
    position: relative;
    display: block;
    width: 20px;
    height: 3px;
    background: #fff;
    border-radius: 1px;
    transition: all .2s;
}
.hamburger span:nth-child(2){
    margin: 5px 0;
}

.hamburger.menu-open span:nth-child(1){
    top: 7.5px;
    .rotate45;
}
.hamburger.menu-open span:nth-child(2){
    opacity: 0;
}
.hamburger.menu-open span:nth-child(3){
    bottom: 8.5px;
    .rotate-45;
}
.hamburger-tile{
    vertical-align: middle;
    font: 16px/22px @mainFont;
    color: #fff;
}
.menu-mobile .menu-main-item{
    margin-bottom: 1px;
    display: block;
}
/*END MAIN MENU BTN*/


/*MENU MAIN*/
.menu-main{
    font-size: 0;
    .additional-gradient;
}
.menu-main-item{
    position: relative;
    display: inline-block;
    text-align: center;
}
.menu-main-item__link,
.menu-mobile a{
    position: relative;
    display: block;
    padding: 0 8px;
    color: #fff;
}
.menu-main-item__link{
    line-height: 76px;
}
.menu-mobile a{
    line-height: 56px;
}

.menu-main-item__link.active,
.menu-main-item__link:hover,
.menu-mobile li>a.active,
.menu-mobile li>a:hover,
.main-submenu li a:hover{
    color: #fff;
    background: @mainColor;
}
.menu-main-item__link>span,
.menu-mobile li>a>span{
    font: bold 16px/18px @mainFont;
    vertical-align: middle;
}
.menu-main>li:not(:last-child)>a:after{
    content: '';
    position: absolute;
    width: 1px;
    height: 10px;
    top: 50%;
    margin-top: -5px;
}
.menu-main>li a:after{
    right: 0;
    background: rgba(255,255,255,.5);
}
.main-submenu{
    display: none;
    position: absolute;
    z-index: 100;
    padding: 5px 0;
    top: 76px;
    left: 0;
    min-width: 100%;
    text-align: left;
    .additional-gradient;
    .shadow-large;
}
.menu-main-item:not(:last-child) .main-submenu{
    min-width: 150%;
}
.main-submenu-item{
    border-top: 1px solid transparent;
}
.main-submenu-item__link{
    display: block;
    padding: 10px 22px;
    color: #fff;
    font: 15px/18px @mainFont;
}
.main-submenu-item__link:hover,
.main-submenu-item__link.active{
    background: @addColor;
}
/*END MENU MAIN*/

.logo-block{
        img{
            max-width: 123px;
        }
        span{
            display: block;
            font: bold 12px/12px @mainFont;
            color: @red;
        }
    }

/*Header search*/
.search-form-wrapper{
    position: relative;
    box-sizing: border-box;
    width: 100%;
    height: 53px;
    padding-left: 40px;
    border-radius: 27px;
    background: #f8f8f8;
    box-shadow: inset 0 2px 5px rgba(0,0,0,.08);
    button[type='submit']{
        position: absolute;
        width: 20px;
        height: 20px;
        left: 10px;
        top: 50%;
        margin-top: -10px;
        cursor: pointer;
        svg {
            fill: #d0d0d0;
        }
    }
    input[type='search']{
        width: 100%;
        border: none;
        padding: 18px 10px 17px;
        font: 500 14px/14px @headerFont;
        background: transparent;
    }
    input[type='search']:focus{
        box-shadow: none;
    }
}
.search-form-wrapper_catalog{
    margin-bottom: 34px;
}



.search-form-wrapper input[type='search']:focus {color: @black;}

.search-form-wrapper input[type='search']::-webkit-input-placeholder {color: #acacac;}
.search-form-wrapper input[type='search']::-moz-placeholder {color: #555;}
.search-form-wrapper input[type='search']:-ms-input-placeholder {color: #acacac;}

/*End Header search*/


.header-contacts-wrapper{
    text-align: center;
}
.header-contacts-phone{
    display: inline-block;
    margin-bottom: 3px;
}
.header-contacts-phone-pict{
    display: inline-block;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    margin-right: 13px;
    text-align: center;
    font-size: 0;
    line-height: 36px;
    background: @mainColor;
    svg {
        display: inline-block;
        vertical-align: middle;
        fill: #fff;
    }
}
.header-contacts-phone-number{
    font: bold 24px/26px @headerFont;
    vertical-align: middle;
    color: @black;
}
.header-contacts-phone-number__prefix{
    font: bold 20px/26px @headerFont;
}
.header-contacts-phone:hover .header-contacts-phone-pict{
    background: @addColor;
}
.header-contacts-phone:hover .header-contacts-phone-number{
    color: @addColor;
}
.header-contacts-callback__link{
    display: inline-block;
    font: bold 16px/18px @mainFont;
    color: @red;
    border-bottom: 1px dotted @mainColor;
}
/*END HEADER*/


/*TABS GENERAL*/
.tab-content{
    display: none;
}
.tabs-content-wrap div.tab-content:first-child{
    display: block;
}
.tabs-general {
    border-bottom: 1px solid @lightGrey;
    font-size: 0;
}
.tabs-general a{
    position: relative;
    display: block;
    padding: 0 30px;
    line-height: 45px;
    color: @black;
    transition: all .2s ease-out .2s;
}
.tabs-general a.active{
    color: @mainColor;
}
.tabs-general>li>a:after,
.service-items .relative:hover:after{
    background: @mainColor;
}
/*END TABS GENERAL*/


/*MENU TABS MAIN*/
.main-menu-tabs{
    margin-bottom: 20px;
}
.main-menu-tabs-btn{
    position: relative;
    text-align: center;
    display: block;
    padding: 10px 20px 20px;
    margin-bottom: 20px;
}
.main-menu-tabs-btn:after{
    position: absolute;
    display: block;
    content: '';
    left: 0;
    right: 0;
    bottom: -4px;
    height: 4px;
    opacity: 0;
    background: @mainColor;
    transition: all .2s ease-out .2s;
}
a.main-menu-tabs-btn{
    color: @darkGrey;
}
.main-menu-tabs-btn__pict{
    display: inline-block;
    margin: 0 auto 25px;
    width: 129px;
    height: 129px;
    line-height: 129px;
    background: @lightGrey;
    transition: all .1s linear .1s;
    svg {
        fill: @mainColor;
        vertical-align: middle;
    }
    .round;
}
.main-menu-tabs-btns a:hover .main-menu-tabs-btn__pict,
.main-menu-tabs-btns a.active .main-menu-tabs-btn__pict{
    .additional-gradient;
}
.active .main-menu-tabs-btn__pict svg,
a:hover .main-menu-tabs-btn__pict svg{
    fill: #fff;
}
.main-menu-tabs-btn__caption{
    font: 20px/26px @headerFont;
}

/*Tabs content*/
.main-menu-tabs-content{
    padding: 50px 20px 32px;
    background: @black;
}
.main-menu-tabs-content__header{
    font: bold 24px/26px @headerFont;
    margin-bottom: 35px;
    a{
        color: #fff;
    };
    a:hover{
        color: @mainColor;
    }
}
.main-menu-tabs-content-list__item{
    position: relative;
    padding-left: 15px;
    margin-bottom: 12px;
    a{
        font: 18px/22px @headerFont;
        color: #c2c2c2;
    };
    a:hover{
        color: @mainColor;
    };
    :before{
        position: absolute;
        content: '';
        width: 4px;
        height: 4px;
        left: 0;
        top: 9px;
        background: @mainColor;
    };
}
/*END MENU TABS MAIN*/


/*COLS*/
.main-cols{
    margin-bottom: 40px;
}
/*END COLS*/


/*ASIDE*/
.aside{
    margin-bottom: 20px;
}
.aside-header{
    margin: 0 0 10px;
    font: bold 18px/22px @headerFont;
}
.aside-menu-item:not(:last-child){
    border-bottom: 1px solid @lightGrey;
}
.aside-menu-item__link{
    position: relative;
    display: block;
    padding: 11px 0 11px 25px;
    font: 500 18px/22px @headerFont;
    color: @black;
}
.aside-menu-item__link:hover,
.aside-menu-item__link.active{
    color: @mainColor;
}
/*END ASIDE*/


/* ASIDE GENERAL */
.aside-block{
    margin-bottom: 40px;
}
.aside-block__header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 20px 13px;
    margin-bottom: 2px;
    .additional-gradient-vertical;
}
.aside-block__body{
    padding: 20px 20px 25px;
    border: 1px solid @lightGrey;
    border-top: none;
}
.aside-caption{
    flex: 0 0 80%;
    color: #fff;
    font: bold 24px/27px @headerFont;
}
a.aside-caption:focus,
a.aside-caption:hover{
    color: #fff;
}
.aside-spoiler-link{
    position: relative;
    flex: 0 0 auto;
    border-top: 7px solid #fff;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    transition: .1s ease-out .1s;
    cursor: pointer;
}
.aside-spoiler-link.open{
    border-top: none;
    border-bottom: 7px solid #fff;
}

/* END ASIDE GENERAL */


/*ASIDE BANNER*/

.aside-banner-content{
    margin-bottom: 33px;
    font: bold 16px/23px @mainFont;
}
.aside-banner-phone{
    margin-bottom: 20px;
    a{
        font: bold 20px/22px @headerFont;
        color: @black;
    }
    a:hover{
        color: @mainColor;
    }
}
/*END ASIDE BANNER*/


/*PAGING*/
.paging span,
.paging a,
.paring-arrow-left,
.paring-arrow-right{
    min-width: 24px;
    height: 24px;
    vertical-align: middle;
}
.paging span,
.paging a{
    margin: 0 6px;
    font: 16px/24px @mainFont;
    color: @darkGrey;
    .round;
}
.paging span,
.paging a:hover{
    background: @mainColor;
    color: #fff;
}
.paring-arrow-left,
.paring-arrow-right{
    position: relative;
    display: inline-block;
}
.paring-arrow-left:before,
.paring-arrow-right:before{
    position: absolute;
    content: '';
    width: 20px;
    height: 20px;
    top: 2px;
    background: url('/images/1c_franchise/sprite.svg') no-repeat 0 -220px;
}
.paring-arrow-left:before{
    left: 1px;
}
.paring-arrow-right:before{
    right: 1px;
    background-position: -20px -220px;
}
.paring-arrow-right:hover:before{
    background: url('/images/1c_franchise/sprite.svg') no-repeat 0 -200px;
    transform: rotate(270deg);
}
.paring-arrow-left:hover:before{
    background: url('/images/1c_franchise/sprite.svg') no-repeat -20px -200px;
    transform: rotate(270deg);
}
.paging-btn-wrapper{
    position: relative;
    text-align: center;
}
/*END PAGING*/



/*PAGE BOTTOM BANNER*/
.page-bottom-banner{
    padding: 30px 0;
    text-align: center;
    background: @lightGrey;
}
.page-bottom-banner__header{
    margin-bottom: 15px;
    font: 500 26px/28px @headerFont;
    a{
        color: @black;
    };
    a:hover{
        color: @mainColor;
    };
}
.page-bottom-banner__content{
    margin-bottom: 20px;
    font: 20px/24px @mainFont;
}

/*END PAGE BOTTOM BANNER*/



/*FOOTER*/
.footer{
    position: relative;
    background: @black;
}
/*top*/
.footer-top-block{
    padding: 26px 0 23px;
    margin-bottom: 24px;
    background: #313131;
}
.footer-top__header{
    margin-bottom: 18px;
    font: bold 18px/20px @headerFont;
    text-align: center;
    a{
        color: #fff;
    };
}
.footer-top__text{
    margin-bottom: 20px;
    color: #d7d7d7;
}

/*middle*/
.footer-middle-block__header{
    position: relative;
    margin-bottom: 14px;
    font: bold 18px/20px @headerFont;
    a{
        color: #fff;
        border-bottom: 2px solid transparent;
    };
    a.active,
    a:hover{
        color: #fff;
        border-color: @mainColor;
    };
}
.footer-middle-block-menu__item{
    font: 14px/16px @mainFont;
    margin-bottom: 10px;
    color: #d7d7d7;
    a{
        color: #d7d7d7;
    };
    a:hover{
        color: @mainColor;
    };
}
.footer-middle-block-contacts{
    margin-bottom: 20px;
}

.footer-middle-block-spoiler{
    display: none;
}
.footer-middle-block-spoiler-link{
    text-align: center;
    a {
        font: 14px/18px @mainFont;
        color: @lightGrey;
        border-bottom: 1px dashed @lightGrey;
    }
}


/*bottom*/
.footer-bottom-block{
    color: @black;
    background: @lightGrey;
    div{
        font: 12px/14px @mainFont;
    }
    a{
        color: @black;
        text-decoration: underline;
    }
}

.spoiler-link-white{
    position: relative;
    display: inline-block;
}
.spoiler-link-white:after,
.spoiler-link-grey:after{
    position: absolute;
    display: block;
    content: '';
    top: 50%;
    right: -25px;
    margin-top: -10px;
    width: 20px;
    height: 20px;
    background: url('/images/1c_franchise/sprite.svg') no-repeat 0 -200px;
    transition: none;
}
.spoiler-link-grey:after{
    margin-top: -8px;
    background-position: 0 -160px;
}
.spoiler-link-white.open:after{
    background: url('/images/1c_franchise/sprite.svg') no-repeat -20px -200px;
}
.spoiler-link-grey.open:after{
    background: url('/images/1c_franchise/sprite.svg') no-repeat -20px -160px;
}
.social-networks{
    position: relative;
    margin-left: -2px;
    margin-right: -2px;
    display: inline-block;
    vertical-align: middle;
    line-height: 0;
}
.social-networks>li{
    display: inline-block;
    margin: 0 2px;
}
.copyright{
    margin: 10px 0;
    font: 12px/14px @mainFont;
    text-align: left;
}
.designer-copyright{
    margin: 10px 0;
}
/*END FOOTER*/


/*BREADCRUMBS*/
.breadcrumbs{
    margin: 4px 0 25px;
}
.breadcrumbs li{
    font-size: 0;
    display: inline-block;
}
.breadcrumbs li:not(:last-child):after{
    position: relative;
    content: '';
    display: inline-block;
    width: 6px;
    height: 2px;
    margin: 0 2px 0 6px;
    top: -3px;
    background: @mediumGrey;
}
.breadcrumbs-item__text,
.breadcrumbs-item__link{
    font: 13.5px/14px @headerFont;
    color: @mediumGrey;
}
.breadcrumbs-item__text{
    color: @black;
}
/*END BREADCRUMBS*/


/*FORM ELEMENTS*/
input[type='submit']:not(.btn),
button,
button:focus,
button:active{
    outline: none;
    border: none;
    background: transparent;
    box-shadow: none;
}
input[type='text']:focus:invalid,
input[type='tel']:focus:invalid,
textarea:focus:invalid,
select:focus:invalid {
    color: @red;
}
.btn,
a.btn{
    display: inline-block;
    position: relative;
    outline: none;
    border: none;
    padding: 24px 45px 24px;
    border-radius: 34px;
    font: bold 14.5px/14.5px @mainFont;
    text-decoration: none;
    /*white-space: nowrap;*/
    color: #fff;
    background: @addColor;
    background-color: @addColor;
    background: -moz-linear-gradient(left, @addColorLighten10Spin5, @addColor);
    background: -webkit-gradient(linear, left, right, color-stop(0%,@addColor), color-stop(100%@addColor));
    background: -webkit-linear-gradient(left, @addColorLighten10Spin5,@addColor);
    background: -o-linear-gradient(left, @addColorLighten10Spin5, @addColor);
    background: -ms-linear-gradient(left, @addColorLighten10Spin5,@addColor);
    background: linear-gradient(left, @addColorLighten10Spin5, @addColor);
    transition: .1s ease-out .3s;
    cursor: pointer;
}
.btn:focus,
.btn:hover{
    color: #fff;
    background: darken(@mainColor, 8);
    background: @mainColor;
    background-color: @mainColor;
    background: -moz-linear-gradient(left, @mainColor, @addColor);
    background: -webkit-gradient(linear, left, right, color-stop(0%, @addColor), color-stop(100%@addColor));
    background: -webkit-linear-gradient(left, @mainColor, @addColor);
    background: -o-linear-gradient(left, @mainColor, @addColor);
    background: -ms-linear-gradient(left, @mainColor, @addColor);
    background: linear-gradient(left, @mainColor, @addColor);
}

.btn.btn-maincolor{
    background: @mainColor;
}
.btn.btn-maincolor:hover{
    background: @addColorLight10;
}

.btn.btn-small{
    font: 14px/14px @mainFont;
    padding: 18px 29px;
}

.btn.btn-black{
    color: #fff;
    background: @black;
}
.btn.btn-black:hover{
    background: @darkGrey;
}

/*BTN outline*/
.btn-outline{
    position: relative;
    display: inline-block;
    padding: 20px 25px;
    font: bold 17px/17px @headerFont;
    background: transparent;
    color: #fff;
}
.btn-outline:before,
.btn-outline:after{
    position: absolute;
    content: '';
}
.btn-outline:before{
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: 32px;
    z-index: 0;
    background-image: linear-gradient(45deg, @gradientStartColor 0%, @gradientEndColor 100%);
}
.btn-outline:after{
    top: 2px;
    right: 2px;
    bottom: 2px;
    left: 2px;
    border-radius: 28px;
    z-index: 0;
    background: #313131;
}
.btn-outline:hover:before{
    color: @mainColor;
    background-image: linear-gradient(45deg, @gradientStartColor 50%, @gradientEndColor 100%);
}


.btn-outline__pict{
    position: relative;
    top: 1px;
    z-index: 3;
    display: inline-block;
    margin-right: 5px;
    vertical-align: middle;
}
.btn-outline__prefix{
    font-size: 13px;
}
.btn-outline__prefix,
.btn-outline__number{
    position: relative;
    z-index: 3;
    background: linear-gradient(0deg, @gradientStartColor 0%, @gradientEndColor 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; 
    -moz-background-clip: text;
    -moz-text-fill-color: transparent; 
}
.btn-outline:hover .btn-outline__prefix,
.btn-outline:hover .btn-outline__number{
    background: linear-gradient(0deg, @gradientStartColor 50%, @gradientEndColor 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; 
    -moz-background-clip: text;
    -moz-text-fill-color: transparent; 
}
span.btn-outline__number.u-eip-edit-box.u-eip-edit-box-inversed{
    background: none !important;
    color: #fff !important;
    -webkit-background-clip: none;
    -webkit-text-fill-color: #fff; 
    -moz-background-clip: none;
    -moz-text-fill-color: #fff; 
}
/*End BTN outline*/


.btn:not(.btn-default).unactive,
.btn:not(.btn-default).unactive:hover{
    background: #cacaca;
    cursor: not-allowed;
}
.btn.button-status-loading{
    opacity: 0;
}

/*Btns with pict*/
.btn.btn-phone,
.btn.btn-search,
.btn.btn-basket,
.btn.btn-arrow-left{
    padding-left: 55px;
}
.btn.btn-arrow-right{
    padding-right: 55px;
}
.btn.btn-buy{
    padding-left: 55px;
    padding-right: 55px;
}
.cart-table-item__del{
    position: relative;
    display: inline-block;
    padding-left: 20px;
    height: 20px;
    vertical-align: middle;
}

.btn.btn-arrow-left:before,
.btn-arrow-right:after,
.btn-phone:before,
.link-more:after,
.btn-buy:before,
.btn-buy:after,
.btn-search:before,
.basket-clear:before,
.cart-table-item__del:before,
.user-pict:before,
.office-pict:before{
    content:'';
    position: absolute;
    top: 50%;
    margin-top: -10px;
    right: 21px;
    width: 20px;
    height: 20px;
    background: url('/images/1c_franchise/sprite.svg') no-repeat -20px -180px;
}
.link-more:after{
    right: 0;
    margin-top: -7px;
    background-position: -20px -220px;
}
.btn-phone:before{
    left: 26px;
    margin-top: -10px;
    background-position: 0 -60px;
}
/*remove items in basket*/
.basket-clear:before{
    left: 0;
    margin-top: -8px;
    background-position: -20px -80px;
}
.cart-table-item__del:before{
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    background-position: -20px -100px;
}
.btn-search:before{
    left: 20px;
    margin-top: -10px;
    background-position: -20px -240px;
}
.btn.btn-arrow-left:before{
    left: 21px;
    right: auto;
    background-position: 0 -180px;
}
.btn.btn-buy:before{
    left: 23px;
    right: auto;
    background-position: 0 -80px;
}

.basket-clear:hover:before,
.cart-table-item__del:hover:before,
.link-more:hover:after,
.office-pict:hover:before{
    opacity: .5;
}

.user-pict:before,
.office-pict:before{
    left: 0;
    width: 15px;
    height: 15px;
    background-position: 0 -120px;
}
.user-pict:before{
    background-position: 0 -140px;
}
.office-pict:before{
    background-position: -20px -140px;
}


/*** RADIO / CKECKBOX ***/

/*Checkbox*/
.checkbox{
    position: relative;
    box-sizing: border-box;
    padding-left: 33px;
    cursor: pointer;
}
.checkbox:before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 21px;
    height: 21px;
    border-radius: 50%;
    border: 1px solid #c4c4c4;
    background: #fff;
}
.checkbox:after{
    position: absolute;
    box-sizing: border-box;
    top: 6px;
    left: 8px;
    width: 7px;
    height: 7px;
    border-right: 2px solid @mainColor;
    border-bottom: 2px solid @mainColor;
    .rotate45;
}
input[type='checkbox']:checked+label:after{
    content: '';
}
/*End Checkbox*/


/*Radio*/
input[type='radio']+label{
    position: relative;
    padding-left: 25px;
}
input[type='radio']+label:before{
    content: '';
    position: absolute;
    top: 1px;
    left: 0;
    width: 17px;
    height: 17px;
    border: 1px solid #ebebeb;
    background: #ebebeb;
    .round;
}
input[type='radio']:checked+label:before{
    content: "";
}
input[type='radio']:checked+label:after{
    position: absolute;
    content: '';
    width: 7px;
    height: 7px;
    left: 6px;
    top: 7px;
    background: @mainColor;
    .round;
}
.optioned-property input[type='radio']+label:before{
     background: #fff;
}
/*End Radio*/


label{
    display: inline-block;
    width: 100%;
    color: @black;
    .text-medium;
}

/*INPUTS*/
input::-webkit-input-placeholder {color: @mediumGrey;}
input::-moz-placeholder {color: @mediumGrey;}
input:-ms-input-placeholder {color: @mediumGrey;}

textarea::-webkit-input-placeholder {color: @mediumGrey;}
textarea::-moz-placeholder {color: @mediumGrey;}
textarea:-ms-input-placeholder {color: @mediumGrey;}

input[type='text'],
input[type="tel"],
input[type='search'],
textarea,
select,
input[type='password'],
.form-element-wrapper-select{
    position: relative;
    z-index: 1;
    font: 15px/20px @mainFont;
    color: @black;
}

.form-element-wrapper{
    position: relative;
    margin-bottom: 25px;
}
.modal .form-element-wrapper,
.dropdown .form-element-wrapper{
    margin-bottom: 20px;
}

.form-element-wrapper-select,
.form-element{
    box-sizing: border-box;
    width: 100%;
    padding: 20px 30px;
    height: 57px;
    border: none;
    border-radius: 28.5px;
    background: rgba(0,0,0,.03);
    box-shadow: inset 0 2px 5px rgba(0,0,0,.15);
}
.form-element:focus{
    outline: none;
}

input[type='text']:focus,
input[type="tel"]:focus,
input[type='search']:focus,
input[type='password']:focus,
textarea:focus{
    color: @black;
    outline: none;
}
textarea{
    min-height: 180px;
    resize: vertical;
}
.modal textarea{
    min-height: 100px;
}
select{
    padding: 12px 15px;
}
select *{
    color: @darkGrey;
}
input[type='text'][readonly="readonly"]{
    background: @lightGrey;
}
input[type='text'].form-element_small,
input[type='password'].form-element_small{
    padding: 14px 20px;
    height: 42px;
    font: 13px/13px @mainFont;
    background: #f8f8f8;
}

/*Select*/
.form-element-wrapper-select{
    position: relative;
    padding: 0;
    overflow: hidden;
    select {
        position: relative;
        box-sizing: border-box;
        border: none;
        padding-right: 0;
        width: calc(100% + 7px);
        height: 57px;
        outline: none;
        background: transparent;
        cursor: pointer;
    }
    &:after{
        content: '';
        position: absolute;
        z-index: -1;
        right: 22px;
        top: 50%;
        margin-top: -3px;
        border-top: 6px solid @black;
        border-left: 4.5px solid transparent;
        border-right: 4.5px solid transparent;
    };
}
/*End select*/


/*disabled inputs*/
input[disabled],
input[disabled='disabled'],
input[disabled='disabled'] + label,
button[disabled='disabled']{
    cursor: not-allowed;
}
input[disabled='disabled'] + label:before,
input[disabled='disabled']:checked + label:before{
    background:  @lightGrey;
    border-color: @lightGrey;
}
input[disabled],
input[disabled='disabled']{
    background: @brightGrey;
}
input[disabled='disabled']:checked + label:after{
    background:  @mediumGrey;
}
input[disabled='disabled'] + label,{
    color: @mediumGrey;
}
/*end disabled inputs*/

.input-tip{
    position: absolute;
    z-index: 1;
    opacity: 0;
    top: 0;
    left: 35px;
    font: 12px/14px @mainFont;
    color: @mediumGrey;
    transition: all .2s ease-out .2s;
}
input:focus+.input-tip,
textarea:focus+.input-tip{
    top: -17px;
    opacity: 1;
}


.refresh{
    float: right;
    display: inline-block;
    width: 35px;
    height: 35px;
    background: url('/images/1c_franchise/sprite.svg') no-repeat 0 0;
}
.classic-captcha-wrapper{
    line-height: 48px;
    padding: 12px;
    text-align: center;
}
.captcha-img{
    margin-right: 10px;
    max-width: 100%;
}
.recaptcha-wrapper{
    margin: 0 0 20px;
}
.modal .recaptcha-wrapper{
    margin-top: 20px;
}

.required{
    position: absolute;
    right: 10px;
    top: 20px;
    z-index: 0;
    color: @mainColor;
    .text-medium;
}
div[class^='col-md-'] .required,
div[class^='col-lg-'] .required{
    right: 25px;
}
/*END FORM ELEMENTS*/


/*PRODUCT CARD*/

.product-card-gallery-col,
.product-card-props-col{
    margin-bottom: 20px;
}

/*Price / btn blocks*/
.product-card-block{
    margin-bottom: 25px;
    text-align: center;
}
.product-card-price{
    font: 500 18px/26px @headerFont;
}
.product-card-price__number{
    font: bold 26px/26px @headerFont;
}
.product-card-price__number,
.product-card-price__suffix{
    color: @addColor;
}

.product-card-old-price{
    margin-bottom: 10px;
    font: 500 15.3px/17.5px @headerFont;
    color: @mediumGrey;
}
.product-card-old-price__number{
    position: relative;
    font: bold 17.5px/17.5px @headerFont;
    &:after{
        content: '';
        position: absolute;
        left: -1px;
        right: -1px;
        top: 50%;
        height: 1px;
        background: @mediumGrey;
    };
}

/*Card props*/
.product-card-props-wrapper{
    margin-bottom: 30px;
}
.product-card-props{

}
.product-card-props__item{
    margin-bottom: 17px;
    font: 14.5px/16px @mainFont;
}
/*End Card props*/


/*Product card gallery*/
.product-card-gallery{
    display: flex;
    margin-left: -10px;
    margin-right: -10px;
    flex-wrap: wrap;
}
.product-card-gallery-item-wrapper{
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 33.33%;
    flex: 0 0 33.33%;
    max-width: 33.33%;
    padding-left: 10px;
    padding-right: 10px;
    margin-bottom: 10px;
}
.product-card-gallery-img{
    display: block;
    padding: 20px;
    margin-bottom: 16px;
    text-align: center;
    border: 2px solid @lightGrey;
    &:hover{
        border-color: @mainColor;
    }
}
.product-card-gallery-item__img-wrapper{
    display: block;
    padding: 10px;
    border: 2px solid @lightGrey;
    text-align: center;
    line-height: 0;
    cursor: pointer;
    &:hover{
        border-color: @mainColor;
    };
    img{
        max-height: 100px;
    }
}
.product-card-gallery-item__img-wrapper.active{
    border-color: @mainColor;
}
/*End Product card gallery*/

/*Availability*/
.product-card-availability-block{
    padding: 10px 20px;
    margin-bottom: 40px;
    border: 1px solid @mainColor;
}
.availability-block__title{
    margin-bottom: 10px;
}
.availability-list li{
    position: relative;
    padding-left: 15px;
    margin-bottom: 5px;
    font: 14px/16px @mainFont;
}
.availability-list li:before{
    position: absolute;
    content: '';
    width: 5px;
    height: 5px;
    left: 0;
    top: 6px;
    border-radius: 50%;
    background-color: @mainColor;
}
.availability-false li:before{
    background: #c00;
}
/*End availability*/


/*Tabs*/
.product-card-tabs{
    margin-bottom: 27px;
}

.product-card-tab{
    
}
.product-card-tabs a.product-card-tab__link{
    padding: 20px 42px;
    font: 500 20px/24px @headerFont;
}
/*End Tabs*/


.product-card-tab-courses-list.marker-list{
    font: 500 19px/23px @headerFont;
    li {
        margin-bottom: 20px;
    }
    li:before{
        top: 10px;
    }
}

/*Comments*/
.product-card-comments{
    margin-bottom: 70px;
}

/*Optioned-property*/
.optioned-property{
    padding: 21px 20px 17px;
    margin-bottom: 6px;
    background: #f5f5f5;
}
.optioned-property__title{
    margin-bottom: 8px;
    font: bold 15.5px/16px @mainFont;
}
.optioned-property-list__item{
    display: inline-block;
    margin-right: 10px;
}
.optioned-property-list__item label{
    font: 15px/16px @mainFont;
}
/*END PRODUCT CARD*/


/*SPINNER*/
.spinner-input-wrapper{
    position: relative;
    display: inline-block;
    padding: 0 30px;
    height: 30px;
}
.spinner-input-wrapper input[type='text'].spinner-input{
    box-sizing: border-box;
    display: inline-block;
    border: 1px solid #ebebeb;
    max-width: 50px;
    height: 30px;
    font: bold 15px/30px @headerFont;
    text-align: center;
}
.spinner-input-wrapper input[type='text'].spinner-input:focus{
    outline: none;
    border-color: @mainColor;
}
.spinner-input-wrapper .ui-spinner-down,
.spinner-input-wrapper .ui-spinner-up{
    position: absolute;
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    color: @black;
    cursor: pointer;
}
.spinner-input-wrapper .ui-spinner-down:hover,
.spinner-input-wrapper .ui-spinner-up:hover{
    color: @mainColor;
}
.spinner-input-wrapper .ui-spinner-down{
    left: 0; 
}
.spinner-input-wrapper .ui-spinner-up{
    right: 0; 
}
.spinner-input-wrapper .ui-spinner-down:after,
.spinner-input-wrapper .ui-spinner-up:after{
    font: bold 20px/30px @headerFont;
}
.spinner-input-wrapper .ui-spinner-down:after{
    content: '-'; 
}
.spinner-input-wrapper .ui-spinner-up:after{
    content: '+'; 
}
a.ui-spinner-button[disabled='disabled'],
a.ui-spinner-button[disabled='disabled']:hover{
    cursor: not-allowed;
    color: @mediumGrey;
}
/*END SPINNER*/


/*CART*/
.cart-table{
    text-align: center;
    margin-bottom: 55px;
}
.cart-table-header{
    display: none;
    padding: 27px 0 28px;
    margin-bottom: 4px;
    font: bold 14.5px/16px @mainFont;
    background: @mainColor;
    color: #fff;
}
.cart-table-item-wrapper{
    border: 1px solid @lightGrey;
    margin-bottom: 4px;
}
.cart-table-items{
    margin-bottom: 30px;
}
.cart-table-item{
    padding: 24px 0;
}
.cart-table-item-col{
    margin-bottom: 20px;
}
.cart-table-item__header{
    font: bold 14.5px/16px @mainFont;
    color: @black;
}
.cart-table-item-price{
    font: 500 16px/18px @headerFont;
    strong {
        font-weight: bold;
    }
}
.cart-table-item-tip{
    font: 14px/16px @mainFont;
}
.cart-table-footer-col-left,
.cart-table-footer-col-right{
    margin-bottom: 10px;
}
.cart-table-footer-discount,
.cart-table-footer-summary,
.cart-table-footer-remove{
    margin-bottom: 10px;
}
.cart-table-footer-summary{
    font: 500 23px/30px @headerFont;
    .result-sum{
        font: bold 27px/30px @headerFont;
        color: @mainColor;
    }
    .result-suffix{
        color: @mainColor;
    }
}
.cart-form{
    margin-bottom: 20px;
}
.cart-form-group{
    margin-bottom: 30px;
}
.cart-form-group-title{
    margin-bottom: 26px;
    font: bold 20px/24px @headerFont;
}
.cart-form-input-title{
    margin-bottom: 17px;
    font: bold 15.5px/16px @mainFont;
}
/*END CART*/


/*AGREEMENT*/
.agreement-wrapper{
    margin-bottom: 22px;
}
.agreement{
    text-align: left;
    p{
        font: 13px/18px @mainFont;
        margin-bottom: 0;
    };

    a{
        font-weight: bold;
    };
}

.checkbox.agreement{
    width: calc(~'100% - 33px');
}
.checkbox.agreement:before{
    top: -2px;
}
.checkbox.agreement:after{
    top: 5px;
}
/*END AGREEMENT*/




/*ALERTS*/
.alert {
    position: relative;
    border-radius: 5px;
    padding: 10px;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    color: @darkGrey;
    font: bold 14px/16px @mainFont;
    p{
        margin-bottom: 0;
    }
}
.alert-success {
    background-color: @mainColorFadeout95;
    border-color: @mainColorLight30;
}
.alert-warning {
    background-color: fadeout(@magenta, 80%);
    border-color: fadeout(@magenta,80%);
}
.alert-danger {
    background-color: fadeout(@red, 80%);
    border-color: fadeout(@red, 80%);
}
.success{
    background: #bdd57d;
}
.alert-header{
    margin-bottom: 15px;
    font: 500 18px/20px @headerFont;
    color: @black;
}
.alert ul{
    padding-left: 20px;
    list-style: circle;
}
/*END ALERTS*/


/*ADVICE */
.advice-block{
    position: relative;
    margin-bottom: 40px;
    background: @lightGrey;
}
.advice-block:before{
    position: absolute;
    z-index: 0;
    top: 0;
    right: 50%;
    bottom: 0;
    left: 0;
    .additional-gradient;
}
.advice-block-columns{
    position: relative;
    z-index: 2;
}
.advice-block-column_right{
    background: @lightGrey;
}
.advice-block-info{
    position: relative;
    padding: 20px;
    color: @black;
    text-align: center;
}

[class*='left'] .advice-block-info{
    padding: 20px 20px 0;
}

.advice-block-info__header{
    margin-bottom: 15px;
    font: bold 25px/35px @headerFont;
}
.advice-block-info__text{
    font: 500 20px/35px @headerFont;
}
.advice-block-form{
    padding: 20px;
    text-align: center;
}
/*END ADVICE */



/*CONTENT*/
.content p{
    word-wrap: break-word;
    margin-bottom: 10px;
}

/*list in content*/
.content ul,
.content ol{
    list-style: none;
    margin-bottom: 15px;
}
.content ol{
    counter-reset: list;
}
.content ul>li,
.content ol>li{
    position: relative;
    left: 20px;
    margin: 0 0 5px;
}
.content ul>li:before{
    content: '';
    position: absolute;
    width: 4px;
    height: 4px;
    margin-left: -15px;
    top: 9px;
    background: @mainColor;
}
.content ol>li:before{
    counter-increment: list;
    content: counter(list);
    position: absolute;
    margin-left: -15px;
    top: 4px;
    font: bold 14px/16px @mainFont;
    color: @mainColor;
}
/*End list in content*/

.marker-list>li{
    position: relative;
    padding-left: 15px;
}
.marker-list>li:before,
.aside-menu a:before{
    content: '';
    position: absolute;
    width: 4px;
    height: 4px;
    left: 0;
    top: 7px;
}
.marker-list.marker-color-grey li:before{
    background: @mediumGrey;
}
.marker-list.marker-color-main li:before,
.aside-menu a:before{
    background: @mainColor;
}
.aside-menu a:before{
    top: 20px;
    left: 10px;
}

.content.text-small ul>li:before{
    top: 7px;
    left: 7px;
}
.content.text-small ol>li:before{
    top: 2px;
    left: 7px;
    font: 12px/14px @mainFont;
}

.content table{
    border: none;
    border-collapse: collapse;
    margin-bottom: 15px;
}
.content table th,
.content table td{
    border: none;
    padding: 15px 20px 14px;
    font: bold 16px/20px @mainFont;
}
.content table tr:nth-child(odd){
    background: @lightGrey;
}


.share-title{
    position: relative;
    top: 2px;
}

.table-wrapper{
    overflow: auto;
}
.table-wrapper table{
    min-width: 768px;
}

.content img{
    max-width: 100%;
}

[class*='img-float-']{
    display: block;
    margin-bottom: 20px;
    text-align: center;
    line-height: 0;
}
/*END CONTENT*/


/*DIVIDERS*/
.vert-divider-md:before{
    background: fadeout(@mainColor, 80%);
}
.vert-divider-md:after{
    background: desaturate(lighten(@mainColor, 80%), 20%);
}
/*END DIVIDERS*/



/*SLIDER*/

/* loader */
.slick-slide{
    position: relative;
    /*max-width: 100% !important;*/
}
.slick-slide:focus{
    outline: none;
}
.main-banner{
    margin-bottom: 50px;
    text-align: center;
    background: @lightGrey;
}

/*banner controls*/
.btn-prev,
.btn-next{
    position: absolute;
    z-index: 99;
    width: 50px;
    height: 50px;
    text-decoration: none;
    transition: all .15s ease-out .15s;
    cursor: pointer;
}
.btn-prev{
    left: 0px;
}
.btn-next{
    right: 0px;
}
.btn-prev:before,
.btn-prev:after,
.btn-next:before,
.btn-next:after{
    position: absolute;
    content: '';
    display: block;
    width: 1px;
    height: 15px;
    background: @darkGrey;
    transition: all .15s ease-out .15s;
}

.btn-prev:before,
.btn-next:before{
    top: 12px;
    left: 50%;
}

.btn-prev:after,
.btn-next:after{
    top: 22px;
    left: 50%;
}
.btn-prev:before,
.btn-prev:after{
    margin-left: -2px;
}
.btn-next:before,
.btn-next:after{
    margin-right: -2px;
}
.btn-prev:before,
.btn-next:after{
    .rotate45;
}

.btn-prev:after,
.btn-next:before{
    .rotate-45;
}
.btn-prev:hover:before,
.btn-prev:hover:after,
.btn-next:hover:before,
.btn-next:hover:after,{
    background: @mainColor !important;
}
/*end banner controls*/

/*pager*/
.main-banner-paging{
    position: relative;
    margin-left: auto;
    margin-right: auto;
    z-index: 60;
    text-align: center;
    font-size: 0;
    line-height: 50px;
    >li{
        display: inline-block;
        margin: 0 4px;
        vertical-align: middle;
    }
    button{
        display: block;
        width: 6px;
        height: 6px;
        padding: 0;
        border-radius: 50%;
        background: #fff;
        font-size: 0;
        cursor: pointer;
    }
}

.main-banner-paging .slick-active button,
.main-banner-paging button:hover{
    background: @mainColor;
    box-shadow: 0 0 1px 2px rgba(255,255,255,.5);
}
/*end pager*/

.main-banner-pict{
    position: relative;
    width: 100%;
}
.main-banner-content-wrapper{
    position: relative;
}
.main-banner-content{
    box-sizing: border-box;
    z-index: 100;
    width: 100%;
    padding: 15px;
    background: rgba(255, 255, 255, .4);
}
.main-banner-content__header{
    position: relative;
    margin: 0 0 10px;
    font: bold 26px/36px @headerFont;
    a {
        color: @black;
        text-shadow: 0 0 1px #fff, 0 0 15px rgba(255,255,255,.3);
    };
    a:hover {
        color: @darkGrey;
    };
    a:focus {
        outline: none;
    };
}
.main-banner-content__header:before{
    background: @mainColor;
}
.main-banner-content__text{
    margin-bottom: 20px;
    font: 18px/24px @mainFont;
    text-shadow: 0 0 1px #fff, 0 0 5px rgba(255,255,255,.3);
}

/*END SLIDER*/


/*Main page titles*/
.news-block__header,
.advantages-block__header,
.reviews-slider__header{
    font: bold 24px/25px @headerFont;
    text-align: center;
    a {
        color: @black;
    }
    a:hover {
        
    }
}
/*END Main page titles*/


/*ADVANTAGES*/
.advantages-block{
    margin-bottom: 46px;
}
.advantages-block__header{
    margin-bottom: 35px;
}
.svg-pict-colorwhite svg{
    fill: #fff;
}
.svg-pict-colormain svg{
    fill: @mainColor;
}
a:hover .svg-pict-colormain svg{
    transition: all .04s ease-out .04s;
    fill: saturate(darken(@mainColor, 12), 80%);
}
.advantages-block-item{
    padding: 30px;
    border: 2px solid @lightGrey;
    text-align: center;
}
.advantages-block-item__pict{
    display: inline-block;
    width: 116px;
    height: 116px;
    line-height: 116px;
    margin-bottom: 27px;
    border-radius: 50%;
    .additional-gradient;
    img{
        vertical-align: middle;
    }
}
.advantages-block-item__title{
    font: 500 18px/20px @headerFont;
    margin-bottom: 15px;
    a {
        color: @black;
    }
}
.advantages-block-item__text{
    font: 15px/24px @mainFont;
}
/*END ADVANTAGES*/





/*PROMO COUNTER*/
.promo-counters-block{
    text-align: center;
    margin-bottom: 42px;
}
.promo-counter{
    margin-bottom: 20px;
}
.promo-counter__title{
    a{
        position: relative;
        padding-right: 22px;
        display: inline-block;
        font: 500 23px/25px @headerFont;
        color: @black;
    };
    a:hover{
        color: @addColor;
    };
    a:before,
    a:after{
        content: '';
        position: absolute;
        background: @mainColor;
        width: 2px;
        height: 12px;
        right: 0;

    }
    a:before{
        transform-origin: bottom;
        top: 2px;
        .rotate-45;
    }
    a:after{
        transform-origin: top;
        bottom: 0px;
        .rotate45;
    }
    a:hover:after,
    a:hover:before{
        background: @addColor;
    }

}
.promo-counter-circle{
    position: relative;
    display: flex;
    margin:0 auto 27px;
    width: 200px;
    height: 200px;
    align-items: center;
    justify-content: center;
}
.promo-counter-circle:before,
.promo-counter-circle:after{
    position: absolute;
    content: '';
    border-radius: 50%;
}
.promo-counter-circle:before{
    z-index: 0;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    animation: rotation360 linear .8s infinite;
    .additional-gradient;
}
.promo-counter-circle.finish:before{
    animation: none;
    .main-gradient;
}
.promo-counter-circle:after{
    z-index: 1;
    top: 2px;
    right: 2px;
    bottom: 2px;
    left: 2px;
    background: #fff;
}
.promo-counter-circle-inner{

}
.promo-counter-circle__digits{
    position: relative;
    z-index: 3;
    font: 40px/40px @headerFont;
    color: @mainColor;
}
.promo-counter-circle__title{
    position: relative;
    z-index: 3;
    max-width: 160px;
    margin: 0 auto;
    font: 12px/16px @headerFont;
}
/*END PROMO COUNTER*/


/*REVIEWS SLIDER*/
.reviews-slider-block{
    padding-top: 35px;
    margin-bottom: 30px;
    .block-top-gradient;
}
.reviews-slider-block .reviews-slider__header{
    margin-bottom: 30px;
}
.reviews-slider{
    text-align: center;
}
.reviews-slide-pict{
    margin: 0 0 30px 0;
    border: 10px solid @lightGrey;
    border-radius: 3px;
    display: inline-block;
    transition: .2s ease-out .2s;
    &:hover{
        border-color: @mainColor;
    };
}
.reviews-slide-content{
    overflow: hidden;
}
.reviews-slide-content__header{
    padding: 20px 0 30px;
    font: 500 22px/24px @headerFont;
}
.reviews-slide-content__text{
    font: 18px/26px @mainFont;
    margin-bottom: 47px;
}
.reviews-slider .bx-controls-direction{
    margin-top: 15px;
    height: 50px;
    background: @mainColorBright;
}

/*Controls*/
.slider-btn-prev,
.slider-btn-next{
    position: absolute;
    z-index: 99;
    width: 50px;
    height: 50px;
    text-decoration: none;
    background: #ebebeb;
    transition: all .15s ease-out .15s;
    cursor: pointer;
}
.slider-btn-prev{
    left: 0px;
}
.slider-btn-next{
    right: 0px;
}
.slider-btn-prev:before,
.slider-btn-prev:after,
.slider-btn-next:before,
.slider-btn-next:after{
    position: absolute;
    left: 50%;
    top: 50%;
    content: '';
    display: block;
    width: 2px;
    height: 12px;
    background: #fff;
    transition: all .15s ease-out .15s;
}

.slider-btn-prev:before,
.slider-btn-next:before{
    transform-origin: top;
    margin-top: -8px;
}
.slider-btn-prev:after,
.slider-btn-next:after{
    transform-origin: bottom;
    margin-top: -4px;
}


.slider-btn-prev:before,
.slider-btn-prev:after{
    margin-left: 2px;
}
.slider-btn-next:before,
.slider-btn-next:after{
    margin-left: -3px;
}


.slider-btn-prev:before,
.slider-btn-next:after{
    .rotate45;
}
.slider-btn-prev:after,
.slider-btn-next:before{
    .rotate-45;
}

.slider-btn-prev:hover,
.slider-btn-next:hover{
    background: @mainColor !important;
}
.reviews-slider .slider-btn-prev,
.reviews-slider .slider-btn-next{
    border-color: @lightGrey;
    .round;
}
.reviews-slider .slider-btn-prev:hover,
.reviews-slider .slider-btn-next:hover{
    border-color: @mainColor;
}
/*End Controls*/

/*END REVIEWS SLIDER*/


/*REVIEWS*/
.star{
    position: relative;
    display: inline-block;
    width: 20px;
    height: 20px;
    vertical-align: middle;
}
.star:after{
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 20px;
    height: 20px;
    background: url('/images/1c_franchise/sprite.svg') no-repeat 0 -260px;
}
.star.gold:after,
.star.think-gold:after{
    background: url('/images/1c_franchise/sprite.svg') no-repeat -20px -260px;
}
/*END REVIEWS*/



/*MAIN NEWS*/
.news-block{
    padding-top: 35px;
    margin-bottom: 22px;
    .block-top-gradient;
}
.news-block__header{
    margin-bottom: 30px;
}
.news-block-item{
    margin-bottom: 46px;
    text-align: center;
}
.news-block-item__pict{
    display: block;
}
.news-block-item__header{
    margin: 10px 0 18px;
    font: 500 20px/24px @headerFont;
}
.news-block-item-content__text{
    font: 16px/23px @mainFont;
}
/*END MAIN NEWS*/


/*NEWS*/
.news-item-wrap{
    padding: 10px 0;
}

/*END NEWS*/


/*EMPTY CATEGORY*/
.category-placeholder{
    position: relative;
    padding-left: 45px;
}
.category-placeholder-merker{
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -15px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: @mainColor;
}
.category-placeholder-merker:before,
.category-placeholder-merker:after{
    position: absolute;
    content: '';
    display: block;
    width: 2px;
    height: 20px;
    left: 50%;
    margin-left: -1px;
    top: 50%;
    margin-top: -10px;
    background: #fff;
}
/*END EMPTY CATEGORY*/


/*CATEGORY*/
.category{
    margin-bottom: 75px;
}
.category-title{
    display: block;
    margin-bottom: 21px;
    &:hover .category-title__text{
        color: @mainColor;
    };
}
.category-title__pict{
    display: inline-block;
    width: 85px;
    height: 85px;
    border-radius: 50%;
    margin-right: 17px;
    text-align: center;
    line-height: 80px;
    .additional-gradient;
    img {
        vertical-align: middle;
    }
}
.category-title__text{
    display: inline-block;
    width: calc(~'100% - 102px');
    font: bold 24px/26px @headerFont;
    vertical-align: middle;
    color: @black;
}
.category-items-wrapper{
    border: 3px solid @lightGrey;
    margin-bottom: 20px;
}
.category-total-items{
    font: bold 16px/20px @headerFont;
    margin-bottom: 20px;
}
/*END CATEGORY*/


/*CATALOG*/
.general-items-wrapper{
    margin-bottom: 40px;
}
.border-bottom{
    border-bottom: 1px solid @lightGrey;
}

.catalog-item{
    position: relative;
    border-bottom: 1px solid @lightGrey;
}

.catalog-item:last-child{
    border-bottom: none;
}

/* Tile items*/
.catalog-items.tile .catalog-item:after{
    border-color: @lightGrey;
    transition: all .1s ease-out .1s;
}
.catalog-items.tile .catalog-item:hover:after{
    border-color: @mainColorFadeout40;
}



.catalog-item-wrap{
    position: relative;
    padding: 17px 0 17px;
    margin: 0;
    text-align: center;
}
.catalog-item-block{
    box-sizing: border-box;
    padding: 0 10px;
}
.catalog-item-content__header{
    display: inline-block;
    margin-bottom: 10px;
    font: 500 16px/18px @headerFont;
}
.catalog-item-price{
    margin-bottom: 14px;
    font: 500 17.5px/20px @headerFont;
}
.catalog-item-price_old{
    font: 500 15px/20px @headerFont;
}

.catalog-item-price__value{
    font: bold 20px/20px @headerFont;
}
.catalog-item-price__value,
.catalog-item-price__suffix{
    color: @addColor;
}
.catalog-item-price_old{
    margin-bottom: 5px;
    color: #989898;
}
.catalog-item-price__old-value{
    position: relative;
    display: inline-block;
    font: bold 17.5px/20px @headerFont;
    &:after{
        content: '';
        position: absolute;
        top: 50%;
        left: -1px;
        right: -1px;
        height: 1px;
        background: #989898;
    };
}


.catalog-item-block__pict{
    text-align: center;
    vertical-align: middle;
    img {
        max-width: 100% !important;
        max-height: 100% !important;
    }
}
.catalog-item-block__round-pict,
.catalog-item-block__round-small-pict{
    display: inline-block;
    width: 106px;
    height: 106px;
    line-height: 106px;
    border: 1px solid @lightGrey;
    border-radius: 50%;
    text-align: center;
    vertical-align: middle;
    img {
        max-width: 80px;
    }
    &:hover{
       border-color: @mainColor; 
    };
}
.catalog-item-block__round-small-pict{
    width: 75px;
    height: 75px;
    line-height: 75px;
    img {
        max-width: 45px;
    }
}
.catalog-item-content__props,
.catalog-item-content__text{
    display: none;
}


.category-spoilers-wrapper{
    margin-bottom: 49px;
}
.category-items-wrapper .category-spoilers{
    padding: 4px 4px 0;
}
.category-spoiler{
    padding: 14px 20px 15px;
    background: @lightGrey;
    &:not(:last-child){
        margin-bottom: 5px;
    }
}
.category-spoiler-header__pict{
    display: inline-block;
    margin-right: 18px;
    vertical-align: middle;
    img,
    svg {
        max-width: 45px;
        fill: @mainColor;
        /*.additional-gradient;*/
    }
}
.category-spoiler-header__text{
    position: relative;
    display: inline-block;
    border-bottom: 1px dashed @black;
    font: 500 20px/20px @headerFont;
    color: @black;
    &:hover,
    &.open{
        color: @mainColor;
        border-color: @mainColor;
    }
    &:after{
        cintent: '';
    };
}
.category-spoiler-content{
    padding: 30px;
}
.category-spoiler-content-list__item{
    position: relative;
    padding-left: 16px;
    margin-bottom: 10px;
    a {
        text-decoration: none;
        color: @black;
    }
    a:hover {
        color: @mainColor;
    }
    &:before{
        content: '';
        position: absolute;
        content: '';
        width: 4px;
        height: 4px;
        left: 0;
        top: 9px;
        background: @mainColor;
    }
}
.category-spoiler-content-list a.active {
    color: @mainColor;
}


/*Additional catalog func*/
.catalog-item-add-func{
    position: absolute;
    z-index: 100;
    top: 10px;
    right: 15px;
    line-height: 20px;
    text-align: center;
}
.catalog-item-add-func li{
    margin-bottom: 8px;
}

/*in store */
.catalog-item-store{
    position: relative;
    display: inline-block;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #aaa;
    cursor: pointer;
}
.catalog-item-store:after{
    content: '';
    position: absolute;
    top: -5px;
    left: -5px;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    border-width: 1px;
    border-style: solid; 
    border-color: #aaa;
}
.catalog-item-store.in-store{
    background-color: @mainColor;
}
.catalog-item-store.in-store:after{
    border-color: @mainColor;
}
.store-note{
    display: none;
    position: absolute;
    z-index: 100;
    top: 50%;
    margin-top: -18px;
    right: 20px;
    padding: 5px 10px;
    border-radius: 5px;
    font-size: 12px;
    white-space: nowrap;
    background: #fff;
    opacity: 0;
    transition: .2s ease-out .2s;
    box-shadow: 0 0 15px rgba(0,0,0,.1);
}
.store-note:after {
    content: '';
    position: absolute;
    z-index: 1;
    right: -9px;
    top: 50%;
    margin-top: -6px;
    border-left: 9px solid #fff;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
}
.catalog-item-store:hover .store-note{
    display: block;
    opacity: 1;
}

/*end in store */

/*Catalog controls*/
.catalog-controls-wrapper{
    display: none;
    overflow: hidden;
    padding: 10px 0;
    border-top: 1px solid @mainColorFadeout80;
    border-bottom: 1px solid @mainColorFadeout80;
}
.catalog-controls-block:nth-child(1)>*{
    line-height: 24px;
}
.catalog-controls-block{
    text-align: center;
    color: @black;
}
.catalog-controls-block__sort-title{
    font: bold 16px/18px @mainFont;
}

.sort-by{
    margin-right: 7px;
    color: @mediumGrey;
    cursor: pointer;
}
.sort-by.active,
.sort-by:hover{
    color: @mainColor;
}
.sort-by__pict svg{
    fill: @mainColor;
}

.catalog-controls-block_grid{
    display: none;
}
a.catalog-controls-btn{
    display: inline-block;
    height: 20px;
    margin-left: 11px;
    cursor: pointer;
}
a.catalog-controls-btn svg{
    fill: @black;
}
a.catalog-controls-btn:hover svg,
a.catalog-controls-btn.active svg{
    fill: @mainColor;
}
/*End catalog controls*/
/*END CATALOG*/


/*CATALOG FILTERS*/
.catalog-filter-block{
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: 1px solid #f5f5f5;
}
.catalog-filter-row{
    margin-bottom: 5px;
}
.catalog-filter-btns-block{
    text-align: center;
}
.catalog-filter-btn-reset{
    color: @mainColor;
    font: bold 15px/17px @mainFont;
    border-bottom: 1px dashed @mainColor;
}
.catalog-filter-btn-reset:hover{
    color: @addColor;
    border-bottom-color: @addColor;
}
.catalog-filters-btn-result{
    margin-bottom: 12px;
}
.filters-spoiler{
    display: none;
}



input[type='text'].input-small{
    padding: 8px 10px;
}

.filter-block-title{
    position: relative;
    font: bold 16.5px/18px @mainFont;
    color: @black;
    margin: 0 0 13px;
    padding-right: 20px;
}

.filter-block-reset{
    position: absolute;
    top: 0;
    right: 0;
    width: 10px;
    height: 10px;
    cursor: pointer;
}
.filter-block-reset:before,
.filter-block-reset:after{
    position: absolute;
    z-index: 1;
    content: '';
    width: 1px;
    height: 13px;
    left: 50%;
    top: 0;
    background: @mediumGrey;
}
.filter-block-reset:before{
    transform: rotate(45deg);
}
.filter-block-reset:after{
    transform: rotate(-45deg);
}
.filter-block-reset:hover:before,
.filter-block-reset:hover:after,
.active .filter-block-reset:before,
.active .filter-block-reset:after{
    background: @mainColor;
}
.catalog-filter-range{
    margin-bottom: 20px;
    font-size: 0;
}
input[type='text'].range-input{
    width: 40%;
    display: inline-block;
    vertical-align: middle;
}
.range-divider{
    position: relative;
    display: inline-block;
    width: 20%;
    height: 36px;
    vertical-align: middle;
}
.range-divider:after{
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -3px;
    width: 5px;
    height: 1px;
    content: '';
    background: @black;
}
.filter-block-element{
    margin-bottom: 5px;
}



/*slider range*/
.ui-slider-handle{
    position: absolute;
    z-index: 1;
    display: block;
    width: 13px;
    height: 13px;
    border-radius: 9px;
    top: -4px;
    left: 0;
    background: @mainColor;
    cursor: pointer;
}
.slider-range{
    position: relative;
    margin: 0 12px 10px 0;
}
.slider-range:before{
    position: absolute;
    content: '';
    left: 0;
    right: -13px;
    height: 5px;
    background: #fff;
}
.ui-slider-range{
    position: relative;
    height: 5px;
    margin: 0 -5px 0 5px;
    background: @mainColorLight20;
    // .additional-gradient;
}
/*END CATALOG FILTERS*/


/*SERVICES LIST*/
.service-item-wrapper{
    position: relative;
    margin-bottom: 30px;
    &:before,
    &:after{
        content: '';
        position: absolute;
        right: 0;
        left: 0;
    };
    &:before{
        z-index: -1;
        top: 0;
        bottom: 0;
        border: 2px solid @lightGrey;
    }
}
.service-item{
    padding: 30px 29px 28px;
}
.service-item__header{
    margin-bottom: 17px;
    font: 500 19px/26px @headerFont;
}
.service-item__content{
    margin-bottom: 23px;
    font: 500 16px/22px @headerFont;
}
.service-item-price{
    color: @addColor;
}
.service-item-price__number{
    font: bold 24px/24px @headerFont;
}
.service-item-price__suffix{
    font: 500 19px/24px @headerFont;
}
/*END SERVICES LIST*/


/*NEWS LIST*/
.general-items-list{

}
.general-item{
    border-bottom: 1px solid @lightGrey;
    padding: 32px 0;
    text-align: center;
}
.general-item:nth-child(1){
    padding-top: 0;
}
.category-items-wrapper .general-item{
    padding: 32px 20px;
}

.general-item-pict{
    display: block;
    margin-bottom: 35px;
    line-height: 0;
}
.general-item-pict_reviews{
    border: 1px solid @lightGrey;
}




/*END NEWS LIST*/


/*SERVICE PAGE*/
.service-page__content{
    margin-bottom: 30px;
    font: 500 18px/33px @headerFont;
}
.service-page-items{
    margin-bottom: 25px;
}
.service-page-item-wrap{
    padding-bottom: 15px;
    border-bottom: 1px solid @lightGrey;
    &:not(:last-child){
        margin-bottom: 15px;
    };
}
.service-page-item-descr{
    margin-bottom: 20px;
}
.service-page-item-descr__header{
    margin-bottom: 10px;
    font: 500 20px/24px @headerFont;
}
.service-page-item-descr__content{
    margin-bottom: 15px;
}
.service-page-item-descr__info,
.service-page-item-descr__price{
    color: @addColor;
}
.service-page-item-descr__info,
.service-page-item-descr__price,
.service-page-price{
    font: 500 17.5px/24px @headerFont;
}
.service-page-price{
    margin-bottom: 15px;
}
.service-page-price__number{
    font: bold 20px/24px @headerFont;
    color: @addColor;
}
.service-page-item-btn{
    text-align: center;
}
/*END SERVICE PAGE*/


/*QUICK SERACH*/
.search-content{
    position: absolute;
    z-index: 100;
    top: 70px;
    left: 0;
    padding: 40px 50px 20px;
    box-sizing: border-box;
    width: 100%;
    border-radius: 30px;
    background: rgba(255,255,255,.95);
    .shadow-large;
}
.search-content:before{
    position: absolute;
    content: '';
    left: 47px;
    top: -10px;
    border-left: 13px solid transparent;
    border-right: 13px solid transparent;
    border-bottom: 20px solid rgba(255,255,255,.95);
}
.search-results-title{
    margin-bottom: 10px;
    font: 20px/22px @headerFont;
}
.search-content strong{
    font-family: @mainFont;
    font-weight: normal;
}

/*Quick serach item*/
.search-results__item{
    display: flex;
    align-items: flex-start;
    margin-bottom: 30px;
    font: 14px/16px @mainFont;
}
.search-results-items .search-results-item-content a{
    border-bottom: none;
}
/*.search-results-item-content {
    max-width: 200px;
}*/
.search-results-item-content__title{
    margin-bottom: 5px;
    a{
        font: 500 16px/20px @headerFont;
        color: @black;
    }
}
.search-results-item-img-wrapper {
    display: flex;
    width: 80px;
    height: 80px;
    margin-right: 30px;
    justify-content: center;
    align-items: center;
}
.search-results-item-img {
    width: 100%;
    -o-object-fit: contain;
    object-fit: contain;
}
.search-results-item-content__article {
    font: 12px/16px @mainFont;
    padding-top: 10px;
    color: #48494a;
}
.search-results-item-price {
    font: 18px/20px @mainFont;
    color: #48494a;
}
.search-results-item-price__old {
    text-decoration: line-through;
    color: #48494a;
    font: 14px/16px @mainFont;
}
.search-results-item-price__new{
    color: #c00;
    font: 18px/20px @mainFont;
}
.search-results-show-btn-wrapper{
    margin-bottom: 15px;
}
.search-results-show-btn{
    font: bold 14px/16px @mainFont;
    color: @addColor;
}
/*Quick serach item*/
/*END QUICK SERACH*/






/*LIBRARY KNOWLEDGE*/
.library-list{
    margin-bottom: 90px;
}
.library-list-item{
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid-column;
    margin-bottom: 5px;
}
.library-list-item__link{
    display: block;
    padding: 15px 10px 14px;
    font: 500 22px/22px @headerFont;
    text-align: center;
    color: @black;
    background: @lightGrey;
}
.library-list-item__link:hover,
.library-list-item.active>.library-list-item__link{
    color: #fff;
    background: @mainColor;
}

.library-sub-list{
    display: none;
}
.library-sub-list{
    padding: 27px 21px 13px;
    border: 2px solid @lightGrey;
    border-top: none;
}
.library-sub-list-item{
    position: relative;
    padding-left: 15px;
    margin-bottom: 13px;
    font: 500 12.5px/14px @mainFont;
    &:before{
        content: '';
        position: absolute;
        left: 0;
        top: 4px;
        width: 4px;
        height: 4px;
        background: @mainColor;
    };
}
.library-sub-list-item__link{
    color: @black;
}


.term-list{
    margin-bottom: 52px;
}
.term-list-item{
    padding-bottom: 13px;
    border-bottom: 1px solid @lightGrey;
    margin: 0 0 25px;
    &:last-child{
        border-bottom: none;
    };
}
.term-list-item__title{
    margin-bottom: 10px;
    font: 500 20px/22px @headerFont;
    color: @mainColor;
}
.term-list-item__text{
    margin: 0;
    padding: 0;
}

/*END LIBRARY KNOWLEDGE*/


/*TRADE OFFERS*/
.trade_offers_item{
    margin-bottom: 20px;
    font-size: 14px;
}
/*END TRADE OFFERS*/


/*MODAL*/
.modal{
    display: none;
    position: fixed;
    top: 100px;
    bottom: auto;
    left: 0;
    right: 0;
    padding: 37px 20px 20px;
    background: #fff;
    z-index: 1001;
    transform: scale(.1,.1);
    opacity: 0;
    .shadow-large;
    transition: all .3s ease-out .1s;
}
.modal.modal_open{
    opacity: 1;
    transform: scale(1,1);
}
.modal-header{
    position: relative;
    margin-bottom: 25px;
    text-align: center;
    font: bold 28px/28px @headerFont;
}
.modal-header.modal-header_buy{
    margin-bottom: 44px;
}

/*Close btn*/
.modal-close{
    position: absolute;
    width: 27px;
    height: 27px;
    border: 2px solid #fff;
    top: -40px;
    right: 10px;
    border-radius: 50%;
    cursor: pointer;
    transition: .1s ease-out .1s;
}
.modal-close:before,
.modal-close:after{
    position: absolute;
    content: '';
    width: 2px;
    height: 15px;
    top: 50%;
    left: 50%;
    margin-top: -7.5px;
    margin-left: -0.5px;
    background: #fff;
    transition: .1s ease-out .1s;
}
.modal-close:before{
    .rotate-45;
}
.modal-close:after{
    .rotate45;
}
.modal-close:hover{
    border-color: @mainColor;
}
.modal-close:hover:before,
.modal-close:hover:after{
    background: @mainColor;
}

/*End Close btn*/


.mask,
.fake-mask{
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(0,0,0,.7);
    z-index: 1000;
}
.fake-mask{
    background: none;
}
body.blur {
    footer>div,
    header>div,
    >div.container,
    >section{
        -webkit-filter: blur(5px);
        -moz-filter: blur(5px);
        -o-filter: blur(5px);
        -ms-filter: blur(5px);
        filter: blur(5px);
    }
}
.loader{
    position: fixed;
    left: 50%;
    top: 50%;
    margin-top: -17px;
    margin-left: -17px;
    width: 34px;
    height: 34px;
    z-index: 1000;
    background: url('/images/1c_franchise/loader.svg');
}
.paging-btn-wrapper .loader{
    position: absolute;
}

.modal-body{
    margin-bottom: 20px;
}

.modal-price-sum-wrapper{
    font: 500 16px/18px @headerFont;
}

.modal-price-sum{
    font: bold 18px/18px @headerFont;
}
.modal-price-sum,
.modal-price-sum-suffix{
    color: @addColor;
}
.modal-body-item{
    margin-bottom: 35px;
}
.modal-body-item__title{
    margin-bottom: 10px;
    a{
        font: 500 18px/20px @headerFont;
    }
}
.modal-body-item-price-block{
    font: 500 23px/23px @headerFont;
}
.modal-body-item__price{
    font: bold 26px/23px @headerFont;
    color: @addColor;
}
.modal-body-item-price__suffix{
    color: @addColor;
}
.modal-btns-wrapper{
    text-align: center;
}
.modal-btns-wrapper .btn{
    margin: 0 3px 16px;
}

/*END MODAL*/



/*DROPDOWN*/
.dropdown{
    display: none;
    position: fixed;
    z-index: 1001;
    padding: 30px 20px 25px;
    top: 60px;
    left: 0;
    right: 0;
    text-align: center;
    background: #fff;
    line-height: 14px;
    .shadow-large;
}
.dropdown-btn-wrapper{
    margin: 17px 0 20px;
}
.dropdown-text{
    font: 500 13.5px/14px @headerFont;
    color: @black;
}
/*END DROPDOWN*/


/*SCROLL-TOP*/
.scroll-top{
    display: none;
    position: fixed;
    z-index: 1500;
    bottom: 2%;
    right: 2%;
    text-align: center;
    opacity: .7;
}
.scroll-top:hover{
    opacity: 1;
}
.scroll-top__btn{
    position: relative;
    width: 74px;
    height: 74px;
    border-radius: 50%;
    background: @mainColor;
    color: #fff;
    cursor: pointer;
    transform-origin: bottom;
    transform: scale(.5,.5);
    transition: .1s ease-out .1s;
}

.scroll-top__btn:before,
.scroll-top__btn:after{
    position: absolute;
    content: '';
    width: 14px;
    height: 2px;
    top: 47%;
    background: #fff;
}
.scroll-top__btn:before{
    left: 47%;
    .rotate45;
}
.scroll-top__btn:after{
    right: 47%;
    .rotate-45;
}

.scroll-top__tip{
    font: bold 14px/16px @mainFont;
    color: @mainColor;
}
/*END SCROLL-TOP*/


/*CONTACTS*/
.contacts-header{
    margin-bottom: 11px;
    font: bold 20px/28px @headerFont;
}
.contacts-items{
    margin-bottom: 37px;
}
.contacts-item,
.contacts-info{
    margin-bottom: 15px;
    font: 500 17px/24px @headerFont;
}

.map-wrapper>.code_pre.yandex_map>ymaps{
    width: 100% !important;
}
/*END CONTACTS*/


/*ALBUM PAGE*/
.album-item-link{
    display: block;
    padding: 22px;
    margin-bottom: 24px;
    border: 2px solid @lightGrey;
    line-height: 0;
    text-align: center;
    &:hover{
        border-color: @addColor;
    };
}


/*END ALBUM PAGE*/


/*TRANSFORMS*/
.rotate45,
.category-placeholder-merker:before{
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}
.rotate-45,
.category-placeholder-merker:after{
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.rotate180{
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}
/*END TRANSFORMS*/


/*FILES LIST*/
.files-list{
    margin-bottom: 33px;
    background: #fff;
}
.files-list li{
    position: relative;
    padding-left: 45px;
    margin-bottom: 10px;
    font: 500 19px/23px @headerFont;
}
.files-list-item-link{
    text-decoration: none;
    vertical-align: baseline;
}
.files-list-item-link__pict,
.files-list-item-link__name{
    display: inline-block;
}
.files-list-item-link__pict{
    position: absolute;
    top: -7px;
    left: 0;
    vertical-align: middle;
    svg {
        fill: @mainColor;
    }
}
/*END FILES LIST*/


/*TRANSFORMS*/
.rotate45{
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}
.rotate-45{
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.round{
    border-radius: 50%;
}
.round-corner-small{
    border-radius: 3px;
}
.round-corner-large{
    border-radius: 12px;
}
.round50{
    width: 50px;
    height: 50px;
    .round;
}
.round60{
    width: 60px;
    height: 60px;
    line-height: 55px;
    .round;
}
.round90{
    width: 90px;
    height: 90px;
    .round;
}
.round200{
    width: 200px;
    height: 200px;
    .round;
}
/*END TRANSFORMS*/


/*EFFECTS*/
.ease-out{
    transition: all .2s ease-out .2s;
}
.opacity-hover:hover{
    opacity: .8;
}
.shadow{
    box-shadow: 0 0 5px rgba(0,0,0,.5);
}
.shadow-large{
    box-shadow: 0 0 15px rgba(54,63,69,.5);
}
@keyframes rotation360{
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
/*END EFFECTS*/


/*LOADER*/
.mask-with-loader{
    position: relative;
}
.mask-with-loader:before{
    position: absolute;
    content: '';
    z-index: 99;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(255,255,255, .5);
}
.mask-with-loader:after{
    position: absolute;
    z-index: 100;
    content: '';
    width: 64px;
    height: 64px;
    margin-left: -32px;
    margin-top: -32px;
    left: 50%;
    top: 50%;
    background: url("/images/1c_franchise/loader.svg") no-repeat 50% 50%;
}
.loader{
    position: fixed;
    left: 50%;
    top: 50%;
    width: 64px;
    height: 64px;
    margin-left: -32px;
    margin-top: -32px;
    z-index: 1000;
    background: url('/images/1c_franchise/loader.svg') no-repeat 50% 50%;
}
/*END LOADER*/


/*AP PALETTE*/
.ap-btn-main-pict{
    background: @mainColor;
}
.ap-btn-main-pict:hover {
    background-color: @addColor;
}
/*END AP PALETTE*/