*
{
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

*:before,
*:after
{
    box-sizing: border-box;
}

img
{
    border: none;
}

textarea
{
    overflow: auto;
}

input,
textarea,
input:active,
textarea:active
{
    -webkit-border-radius: 0;
            border-radius: 0;
         outline: none transparent !important;
    box-shadow: none;

    -webkit-appearance: none;
            appearance: none;
    -moz-outline: none !important;
}

input[type=submit],
button[type=submit],
input[type=reset],
button[type=reset]
{
    -webkit-border-radius: 0;

    -webkit-appearance: none;
}

:focus
{
    outline: none;
}

:hover,
:active
{
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-touch-callout: none;
}


::-ms-clear
{
    display: none;
}


::selection
{
    color: #fff;

    background: #14a5f5;
}

::-moz-selection
{
    color: #fff;

    background: #14a5f5;
}



/*---------------
    Main styles
---------------*/
:root
{
    --bg: #fafafa;
    --scroll_width: 17px;
    --aside_width: 145px;
    --text_color: #333;
    --font_size: 16px;
    --font_size_title: 30px;
    --font_family: 'Montserrat', 'Arial', sans-serif;
    --font_family2: 'Raleway', 'Arial', sans-serif;
}



.clear
{
    clear: both;
}

.left
{
    float: left;
}

.right
{
    float: right;
}



html
{
    height: 100%;

    background: var(--bg);

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
        -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}


body
{
    color: var(--text_color);
    font-family: var(--font_family);
    font-size: var(--font_size);

    height: 100%;

    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;

    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    -webkit-overflow-scrolling: touch;
    text-rendering: optimizeLegibility;
    text-decoration-skip: objects;
    -webkit-touch-callout: none;
}

body.lock
{
    position: fixed;

    overflow: hidden;

    width: 100%;
    height: 100%;
}


.wrap
{
    position: relative;

    display: flex;
    overflow: hidden;
    flex-direction: column;

    width: 100%;
    min-width: 360px;
    min-height: 100%;
}


.main
{
    position: relative;
    /*background: url(../images/bg.png) 50% 0 no-repeat;*/

    flex: 1 0 auto;
}


.cont
{
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 20px;
}


.compensate-for-scrollbar
{
    margin-right: var(--scroll_width) !important;
}


.lozad
{
    transition: opacity .5s linear;

    opacity: 0;
}

.lozad.loaded
{
    opacity: 1;
}


.flex
{
    display: flex;

    justify-content: flex-start;
    align-items: flex-start;
    align-content: flex-start;
    flex-wrap: wrap;
}



.form
{
    --form_border_color: #e6e6e6;
    --form_border_radius: 0;
    --form_bg_color: #fff;
    --form_focus_color: #333;
    --form_error_color: red;
    --form_success_color: green;
    --form_placeholder_color: #333;
}


.form ::-webkit-input-placeholder
{
    color: var(--form_placeholder_color);
}

.form :-moz-placeholder
{
    color: var(--form_placeholder_color);
}

.form :-ms-input-placeholder
{
    color: var(--form_placeholder_color);
}


.form .line
{
    margin-bottom: 29px;
}

.form .field
{
    position: relative;
}


.form .input
{
    color: var(--text_color);
    font: 500 var(--font_size) var(--font_family);

    display: block;

    width: 100%;
    height: 42px;

    transition: .2s linear;

    border: none;
    border-bottom: 1px solid var(--form_border_color);
    border-radius: var(--form_border_radius);
    background: var(--form_bg_color);
}

.form select
{
    color: var(--text_color);
    font: 500 var(--font_size) var(--font_family);

    display: block;

    width: 100%;
    height: 42px;

    transition: .2s linear;

    border: none;
    border-bottom: 1px solid var(--form_border_color);
    border-radius: var(--form_border_radius);
    background: var(--form_bg_color);
}

.form textarea
{
    color: var(--text_color);
    font: 500 var(--font_size) var(--font_family);

    display: block;

    width: 100%;
    height: 89px;

    resize: none;
    transition: .2s linear;

    border: none;
    border-bottom: 1px solid var(--form_border_color);
    border-radius: var(--form_border_radius);
    background: var(--form_bg_color);
}


.form .input:focus,
.form textarea:focus
{
    border-color: var(--form_focus_color);
}

.form .success
{
    border-color: var(--form_success_color);
}

.form .error
{
    border-color: var(--form_error_color);
}


.form .input:disabled,
.form textarea:disabled
{
    cursor: default;
    pointer-events: none;

    opacity: .5;
}


.form .error_text
{
    color: var(--form_error_color);
    font-size: 14px;
    line-height: 20px;

    margin-top: 5px;
}


.form .submit
{
    padding-top: 10px;
}

.form .submit_btn
{
    color: var(--text_color);
    font-family: var(--font_family);
    font-size: var(--font_size);
    font-weight: 700;
    line-height: 23px;

    position: relative;
    z-index: 9;

    display: inline-block;

    cursor: pointer;
    vertical-align: top;
    text-decoration: none;

    border: none;
    background: none;
}

.form .submit_btn:before
{
    position: absolute;
    z-index: -1;
    bottom: 0;
    left: -25px;

    display: block;

    width: 68px;
    height: 11px;

    content: '';
    transition: .2s linear;

    background: #ffd200;
}



.text_block
{
    font-weight: 500;
    line-height: 23px;

    -webkit-user-select: text;
       -moz-user-select: text;
        -ms-user-select: text;
            user-select: text;
    text-align: justify;

    -webkit-touch-callout: text;
}


.text_block > :last-child
{
    margin-bottom: 0 !important;
}

.text_block > :first-child
{
    margin-top: 0 !important;
}


.text_block h2
{
    font-family: var(--font_family2);
    font-size: 33px;
    font-weight: 800;
    line-height: 41px;

    margin-bottom: 20px;
}

.text_block h3
{
    font-size: 25px;
    font-weight: 500;
    line-height: 35px;

    margin-bottom: 20px;
}


.text_block * + h2,
.text_block * + h3
{
    margin-top: 40px;
}

.text_block .clear + h2,
.text_block .clear + h3
{
    margin-top: 20px;
}

.text_block h2 + *,
.text_block h3 + *
{
    margin-top: 0 !important;
}


.text_block ul li
{
    position: relative;

    display: block;
    overflow: hidden;

    padding-left: 20px;

    list-style-type: none;
}

.text_block ul li + li
{
    margin-top: 5px;
}

.text_block ul li:before
{
    position: absolute;
    top: 10px;
    left: 0;

    display: block;

    width: 10px;
    height: 2px;

    content: '';

    background: currentColor;
}


.text_block p,
.text_block ul
{
    margin-bottom: 20px;
}


.text_block a
{
    color: currentColor;
}

.text_block a:hover
{
    text-decoration: none;
}



.overlay
{
    position: fixed;
    z-index: 100;
    top: 0;
    left: 0;

    display: none;

    width: 100%;
    height: 100%;

    opacity: .8;
    background: #333;
}


.supports_error
{
    font-family: 'Arial', sans-serif;
    font-size: 20px;
    line-height: 30px;

    position: fixed;
    z-index: 1000;
    top: 0;
    left: 0;

    display: none;

    width: 100%;
    height: 100%;
    padding: 20px;

    text-align: center;

    background: #fff;

    justify-content: center;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}

.supports_error.show
{
    display: flex;
}



/*---------------
   Header
---------------*/
header
{
    position: fixed;
    z-index: 99;
    top: 40px;
    right: 0;
    left: -176px;

    display: flex;

    width: 870px;
    max-width: 100%;
    margin: auto;

    justify-content: space-between;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}



header .menu
{
    justify-content: space-between;
    align-items: stretch;
    align-content: stretch;
}

header .menu .item + .item
{
    margin-left: 37px;
}

header .menu .item > a
{
    color: var(--text_color);
    font-weight: 500;

    position: relative;
    z-index: 5;

    display: block;

    transition: color .2s linear;
    text-decoration: none;
}

header .menu .item > a:before
{
    position: absolute;
    z-index: -1;
    bottom: 0;
    left: -25px;

    display: block;

    width: 0;
    height: 11px;

    content: '';
    transition: width .2s linear;

    background: #ffd200;
}

header .menu .item:hover > a,
header .menu .item > a.active
{
    color: #000;
}

header .menu .item:hover > a:before,
header .menu .item > a.active:before
{
    width: 67px;
}


header .link
{
    color: var(--text_color);
    font-family: var(--font_family);
    font-size: var(--font_size);
    font-weight: 500;
    line-height: 59px;

    position: relative;

    display: block;

    width: 145px;
    height: 59px;
    padding-left: 61px;

    cursor: pointer;
    white-space: nowrap;
    text-decoration: none;

    border: none;
    border-radius: 30px;
    background: #ffc87d;
}

header .link span
{
    position: relative;
    z-index: 5;

    visibility: hidden;

    transition: .2s linear;
    pointer-events: none;

    opacity: 0;
}

header .link:after
{
    position: absolute;
    top: 0;
    left: 0;

    display: block;

    width: 100%;
    height: 100%;

    content: '';
    transition: width .2s linear .2s;

    border-radius: 30px;
    background: #ffc87d;
}

header .link:before
{
    position: absolute;
    z-index: 2;
    top: 0;
    bottom: 0;
    left: 21px;

    display: block;

    width: 17px;
    height: 17px;
    margin: auto;

    content: '';
    transition: background .2s linear;

    border-radius: 50%;
    background: #fff;
}

header .link:hover:after,
header .link.active:after
{
    width: 275px;

    transition: width .2s linear;
}

header .link:hover:before,
header .link.active:before
{
    background: #333;
}

header .link:hover span,
header .link.active span
{
    visibility: visible;

    transition: .2s linear .2s;
    pointer-events: auto;

    opacity: 1;
}



header.white .menu .item > a
{
    color: #fff;
}

header.white .link,
header.white .link:after
{
    background: #fff;
}

header.white .link:before
{
    background: #333;
}



header.dark .menu .item > a:before
{
    background: #fff;
}

header.dark .link,
header.dark .link:after
{
    background: #fff;
}

header.dark .link:before
{
    background: #333;
}



.mob_header
{
    position: absolute;
    z-index: 101;
    top: 0;
    left: 0;

    display: none;

    width: 100%;
    padding: 14px 0;

    background: #fff;
}

.mob_header .cont
{
    display: flex;

    justify-content: space-between;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}


.mob_header .logo
{
    margin-right: auto;
}

.mob_header .logo a,
.mob_header .logo img
{
    display: block;
}


.mob_header .mob_menu_link
{
    color: var(--text_color);
    font-family: var(--font_family);
    font-size: var(--font_size);
    font-weight: 700;
    line-height: 23px;

    position: relative;

    display: flex;

    padding-right: 52px;

    cursor: pointer;

    border: none;
    background: none;

    justify-content: flex-start;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}

.mob_header .mob_menu_link .icon
{
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;

    display: flex;

    width: 33px;
    height: 18px;
    margin: auto;

    justify-content: center;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}

.mob_header .mob_menu_link .icon span
{
    position: relative;
    top: 0;
    left: 0;

    display: block;

    width: 100%;
    height: 4px;

    transition: .2s linear;

    background: #333;
}

.mob_header .mob_menu_link .icon span + span
{
    margin-top: 10px;
}


.mob_header .mob_menu_link.active span:nth-child(1)
{
    top: 7px;

    transform: rotate(45deg);
}

.mob_header .mob_menu_link.active span:nth-child(2)
{
    top: -7px;

    transform: rotate(-45deg);
}



.mob_menu
{
    position: absolute;
    z-index: 105;
    top: 92px;
    left: 0;

    visibility: hidden;

    width: 100%;
    height: auto;
    min-height: calc(100vh - 92px);
    padding: 55px 50px 20px;

    transition: .2s linear;
    pointer-events: none;

    opacity: 0;
    border-top: 1px solid #333;
    background: #fff;
}

.mob_menu.show
{
    visibility: visible;

    pointer-events: auto;

    opacity: 1;
}


.mob_menu .menu .item + .item
{
    margin-top: 25px;
}

.mob_menu .menu .item > a
{
    color: var(--text_color);
    font-size: 40px;
    line-height: 44px;

    position: relative;
    z-index: 5;

    display: block;

    transition: .1s linear;
    text-decoration: none;
}

.mob_menu .menu .item > a:before
{
    position: absolute;
    z-index: -1;
    bottom: 0;
    left: -25px;

    display: block;

    width: 0;
    height: 17px;

    content: '';
    transition: width .2s linear;

    background: #ffd200;
}

.mob_menu .menu .item:hover > a,
.mob_menu .menu .item > a.active
{
    font-weight: 700;
}

.mob_menu .menu .item:hover > a:before,
.mob_menu .menu .item > a.active:before
{
    width: 189px;
}


.mob_menu .links
{
    display: flex;

    margin-top: 45px;

    justify-content: space-between;
    align-items: flex-start;
    align-content: flex-start;
    flex-wrap: wrap;
}

.mob_menu .links > *
{
    color: var(--text_color);
    font-family: var(--font_family);
    font-size: 16px;
    font-weight: 500;
    line-height: 23px;

    display: inline-block;

    text-align: left;
    vertical-align: top;
    text-decoration: underline;

    border: none;
    background: none;
}


.mob_menu .creator
{
    color: var(--text_color);
    font-size: 11px;
    font-weight: 500;
    line-height: 15px;

    position: relative;

    display: inline-block;

    margin-top: 65px;

    vertical-align: top;
}

.mob_menu .creator:before
{
    position: absolute;
    right: 100%;
    bottom: 100%;

    display: block;

    width: 27px;
    height: 28px;

    content: '';

    background: url(../images/creator_logo2.svg) 0 0/100% 100% no-repeat;
}



/*---------------
   Sidebar
---------------*/
aside
{
    position: fixed;
    z-index: 101;
    top: 0;
    left: 0;

    display: flex;

    width: var(--aside_width);
    max-width: 100%;
    height: 100%;
    padding: 35px 30px;

    background: #fff;

    justify-content: center;
    align-items: center;
    align-content: space-between;
    flex-wrap: wrap;
}

aside:before
{
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;

    display: block;

    width: 100%;
    height: 100%;

    content: '';

    background: #fff;
}


aside .logo img
{
    display: block;

    width: 55px;
    max-width: 100%;
    height: 64px;
    margin: 0 auto;
}

aside .logo img.color,
aside .logo.active img
{
    display: none;
}

aside .logo:hover img.color {
	display: block;
}
aside .logo:hover img.default {
	display: none;
}

aside .logo.active img.color
{
    display: block;
}

aside:hover .logo img.color {
	display: block;
}
aside:hover .logo img.default {
	display: none;
}

aside .menu_link
{
    color: #e6e6e6;
    font-family: var(--font_family);
    font-size: var(--font_size);
    font-weight: 700;
    line-height: 23px;

    position: relative;

    display: flex;

    width: 100%;
    padding-top: 67px;

    transition: color .2s linear;
    transform: rotate(180deg);
    text-decoration: none;

    justify-content: flex-start;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
            writing-mode: vertical-lr;
    -webkit-writing-mode: vertical-lr;
}

aside .menu_link .icon
{
    position: absolute;
    top: 0;
    left: 50%;

    width: 19px;
    height: 33px;
    margin-left: -9px;
}

aside .menu_link .icon span
{
    position: relative;
    top: 0;
    left: 0;

    display: block;

    width: 4px;
    height: 100%;

    transition: .2s linear;

    background: #333;
}

aside .menu_link .icon span + span
{
    margin-left: 10px;
}


aside .menu_link:hover,
aside .menu_link.active
{
    color: var(--text_color);
}

aside .menu_link.active span:nth-child(1)
{
    left: 7px;

    transform: rotate(45deg);
}

aside .menu_link.active span:nth-child(2)
{
    left: -7px;

    transform: rotate(-45deg);
}

@supports (-ms-accelerator: true)
{
    aside .menu_link.active span:nth-child(2)
    {
        top: -7px;
        left: -22px;
    }

    aside .menu_link.active span:nth-child(1)
    {
        top: 13px;
        left: 12px;
    }
}

@supports (-ms-ime-align: auto)
{
    aside .menu_link.active span:nth-child(2)
    {
        top: -7px;
        left: -22px;
    }

    aside .menu_link.active span:nth-child(1)
    {
        top: 13px;
        left: 12px;
    }
}


aside .copyright
{
    font-size: 15px;
    font-weight: 500;

    display: flex;

    width: 100%;

    transform: rotate(180deg);

    justify-content: flex-start;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
            writing-mode: vertical-lr;
    -webkit-writing-mode: vertical-lr;
}



#menu
{
    position: absolute;
    z-index: -2;
    top: 0;
    left: 100%;

    display: flex;
    visibility: hidden;

    width: 1308px;
    height: 100%;

    transition: .35s linear;
    transform: translateX(-100%);

    opacity: 0;
    border-right: 1px solid #333;
    border-left: 1px solid #333;
    background: #f5f5f5;

    justify-content: flex-start;
    align-items: stretch;
    align-content: stretch;
    flex-wrap: wrap;
}

#menu.show
{
    visibility: visible;

    transform: translateX(0);

    opacity: 1;
}


#menu .main_info
{
    display: flex;

    width: 580px;
    padding: 50px 75px;

    justify-content: flex-start;
    align-items: flex-start;
    align-content: space-between;
    flex-wrap: wrap;
}

#menu .main_info .slogan
{
    font-weight: 500;

    display: flex;

    width: 100%;

    justify-content: flex-start;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}


#menu .products_cats
{
    counter-reset: item;
}

#menu .products_cats > * + *
{
    margin-top: 35px;
}

#menu .products_cats a
{
    color: var(--text_color);
    font-family: var(--font_family);
    font-size: 58px;
    line-height: 71px;

    position: relative;

    display: inline-block;

    padding-left: 105px;

    transition: .1s linear;
    vertical-align: top;
    text-decoration: none;
}

#menu .products_cats a:after
{
    position: absolute;
    z-index: -1;
    bottom: 0;
    left: -22px;

    display: block;

    width: 0;
    height: 22px;

    content: '';
    transition: width .35s linear;

    background: #ffd200;
}

#menu .products_cats a:before
{
    font-weight: 200;

    position: absolute;
    top: 0;
    left: 0;

    content: counter(item, decimal-leading-zero);
    counter-increment: item;
    transition: .1s linear;
}

#menu .products_cats a:hover,
#menu .products_cats a.active
{
    font-weight: 700;
}

#menu .products_cats a:hover:before,
#menu .products_cats a.active:before
{
    font-weight: 500;
}

#menu .products_cats a:hover:after,
#menu .products_cats a.active:after
{
    width: 297px;
}


#menu .contacts
{
    display: flex;

    width: 100%;

    justify-content: flex-start;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}


#menu .feedback_link
{
    color: var(--text_color);
    font-family: var(--font_family);
    font-size: 15px;
    font-weight: 500;

    display: inline-block;

    cursor: pointer;
    vertical-align: top;
    text-decoration: underline;

    border: none;
    background: none;
}

#menu .feedback_link:hover
{
    text-decoration: none;
}


#menu .socials
{
    display: flex;

    margin-left: 100px;

    justify-content: flex-start;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}

#menu .socials a
{
    display: block;

    transition: opacity .2s linear;

    opacity: .2;
}

#menu .socials a + a
{
    margin-left: 15px;
}

#menu .socials img
{
    display: block;
}

#menu .socials a:hover
{
    opacity: 1;
}


#menu .creator
{
    color: var(--text_color);
    font-size: 13px;
    font-weight: 500;
    line-height: 19px;

    position: relative;

    display: flex;

    min-height: 63px;
    padding-bottom: 6px;
    padding-left: 175px;

    text-decoration: none;

    justify-content: flex-start;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}

#menu .creator .logo
{
    color: #000;
    font-family: var(--font_family2);
    font-size: 8px;
    font-weight: 800;
    line-height: normal;

    position: absolute;
    top: 0;
    left: 0;

    width: 145px;
    height: 63px;
    padding: 10px 10px 10px 70px;

    background: url(../images/creator_logo.svg) 0 0/100% 100% no-repeat;
}

.privacy_policy {
    margin-top: 20px;
}
.privacy_policy a {
    color: var(--text_color);
    font-family: var(--font_family);
    font-size: 15px;
    font-weight: 500;
    display: inline-block;
    cursor: pointer;
    vertical-align: top;
    text-decoration: underline;
    border: none;
    background: none;
}
.privacy_policy a:hover {
    text-decoration: none;
}



#menu .cats
{
    position: relative;

    width: 726px;

    border-left: 1px solid #333;
}

#menu .cats .grid
{
    position: absolute;
    top: 0;
    left: 0;

    display: grid;

    width: 100%;
    height: 100%;

    background: #333;

    grid-gap: 1px;
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: 33.333%;
}

#menu .cats .item.big
{
    grid-row: 1 / 3;
}

#menu .cats .item
{
    position: relative;

    padding: 39px;

    transition: background .2s linear;

    background: #f5f5f5;
}


#menu .cats .item .main_cat
{
    color: var(--text_color);
    font-family: var(--font_family2);
    font-size: 25px;
    font-weight: 800;
    line-height: 29px;

    display: flex;

    text-decoration: none;

    justify-content: space-between;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}

#menu .cats .item .main_cat .icon
{
    width: 60px;
}

#menu .cats .item .main_cat .icon > *
{
    display: block;

    fill: var(--text_color);
}

#menu .cats .item .main_cat .icon1 > *
{
    width: 45px;
    height: 40px;
}

#menu .cats .item .main_cat .icon2 > *
{
    width: 44px;
    height: 45px;
}

#menu .cats .item .main_cat .icon3 > *
{
    width: 44px;
    height: 35px;
}

#menu .cats .item .main_cat .icon4 > *
{
    width: 44px;
    height: 42px;
}

#menu .cats .item .main_cat .icon5 > *
{
    width: 37px;
    height: 45px;
}

#menu .cats .item .main_cat .name
{
    width: calc(100% - 80px);
}


#menu .cats .item .sub_cats
{
    font-weight: 500;
    line-height: 23px;

    margin-top: 30px;
}

#menu .cats .item .sub_cats > * + *
{
    margin-top: 8px;
}

#menu .cats .item .sub_cats a
{
    color: var(--text_color);

    display: inline-block;

    vertical-align: top;
    text-decoration: none;
}

#menu .cats .item .sub_cats a:hover
{
    text-decoration: underline;
}


#menu .cats .item .link
{
    color: var(--text_color);
    font-weight: 700;
    line-height: 23px;

    position: absolute;
    z-index: 5;
    bottom: 39px;
    left: 39px;

    display: block;

    text-decoration: none;
}

#menu .cats .item .link:before
{
    position: absolute;
    z-index: -1;
    bottom: 0;
    left: -25px;

    display: block;

    width: 0;
    height: 11px;

    content: '';
    transition: width .2s linear;

    background: #fff;
}


#menu .cats .item:hover
{
    background: #ffc87d;
}

#menu .cats .item:hover .link
{
    color: #000;
}

#menu .cats .item:hover .link:before
{
    width: 67px;
}



/*---------------
   Main section
---------------*/
.owl-carousel,
.owl-carousel .slide:first-child
{
    display: block;
}

.owl-carousel .slide
{
    display: none;
}

.owl-carousel .owl-stage
{
    white-space: nowrap;
}

.owl-carousel .owl-item
{
    display: inline-block;
    float: none;

    vertical-align: top;
    white-space: normal;
}

.owl-carousel .slide .lozad
{
    transition: .2s linear;
}



.loading
{
    position: absolute;
    z-index: 99;
    top: 0;
    left: 0;

    display: flex;

    width: 100%;
    height: 100vh;

    justify-content: center;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}

.loading.hide
{
    z-index: 0;

    -webkit-animation: loading 1s;
            animation: loading 1s;
    pointer-events: none;

    opacity: 0;
}

@-webkit-keyframes loading
{
    0%
    {
        transform: scale(1);

        opacity: 1;
    }

    100%
    {
        transform: scale(3);

        opacity: 0;
    }
}
@-moz-keyframes loading
{
    0%
    {
        transform: scale(1);

        opacity: 1;
    }

    100%
    {
        transform: scale(3);

        opacity: 0;
    }
}
@keyframes loading
{
    0%
    {
        transform: scale(1);

        opacity: 1;
    }

    100%
    {
        transform: scale(3);

        opacity: 0;
    }
}


.loading aside
{
    position: fixed;
    top: 50%;
    left: 0;

    display: flex;

    width: 145px;
    height: 586px;
    margin-top: -293px;

    background: #fff;

    justify-content: center;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}

.loading aside .logo
{
    font-weight: 500;
    line-height: 22px;

    display: flex;

    width: 62px;
    padding-top: 70px;

    transform: rotate(180deg);

    background: url(../images/logo.png) 50% 0 no-repeat;

    justify-content: flex-start;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
            writing-mode: vertical-rl;
    -webkit-writing-mode: vertical-rl;
}

.loading aside .logo b
{
    font-family: var(--font_family2);
    font-weight: 800;
}


.loading .info
{
    color: #fff;
    font-size: 25px;
    font-weight: 500;
    line-height: 35px;

    display: flex;

    width: 326px;
    max-width: 100%;
    height: 586px;
    padding: 40px 50px;

    background: rgba(0,205,255,.5);

    justify-content: flex-start;
    align-items: flex-end;
    align-content: flex-end;
    flex-wrap: wrap;
}



.main_content
{
    position: absolute;
    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    opacity: 0;
}

.main_content.show
{
    -webkit-animation: main_content 1s;
            animation: main_content 1s;

    opacity: 1;
}

.main_content.with_scroll
{
    overflow-x: hidden;
    overflow-y: auto;
}


@-webkit-keyframes main_content
{
    0%
    {
        transform: scale(0);

        opacity: 0;
    }

    100%
    {
        transform: scale(1);

        opacity: 1;
    }
}
@-moz-keyframes main_content
{
    0%
    {
        transform: scale(0);

        opacity: 0;
    }

    100%
    {
        transform: scale(1);

        opacity: 1;
    }
}
@keyframes main_content
{
    0%
    {
        transform: scale(0);

        opacity: 0;
    }

    100%
    {
        transform: scale(1);

        opacity: 1;
    }
}



.phone_fixed
{
    font-size: 19px;
    font-weight: 500;
    line-height: 59px;

    position: fixed;
    z-index: 99;
    top: 40px;
    right: 0;

    width: 320px;
}

.phone_fixed a
{
    color: var(--text_color);

    display: inline-block;

    vertical-align: top;
    white-space: nowrap;
    text-decoration: none;
}

.phone_fixed.white a
{
    color: #fff;
}


.title_fixed
{
    font-family: var(--font_family2);
    font-size: 25px;
    font-weight: 800;

    position: fixed;
    z-index: 99;
    top: 50%;
    right: 0;

    width: 320px;
    margin-top: -190px;
}


.slogan_fixed
{
    font-weight: 500;
    line-height: 23px;

    position: fixed;
    z-index: 99;
    top: 50%;
    right: 0;

    width: 320px;
    margin-top: 100px;
}



.portfolio_fixed
{
    color: #323232;
    font-size: 19px;
    font-weight: 500;
    line-height: 27px;

    position: fixed;
    z-index: 99;
    right: 0;
    bottom: 0;

    display: block;

    width: 320px;
    min-height: 180px;
    padding: 30px 35px;

    text-decoration: none;

    background: #ffc87d;
}

.portfolio_fixed .btn
{
    font-size: var(--font_size);
    font-weight: 700;
    line-height: 23px;

    position: relative;
    z-index: 5;

    margin-top: 45px;
	color: #fff;
}

.portfolio_fixed .btn:before
{
    position: absolute;
    z-index: -1;
    bottom: 0;
    left: -35px;

    display: block;

    width: 78px;
    height: 11px;

    content: '';
    transition: width .2s linear;

    background: #333;
}

.portfolio_fixed img
{
    position: absolute;
    right: 20px;
    bottom: 0;

    display: block;

    height: 100%;
    max-height: 142px;
}

.portfolio_fixed:hover .btn:before
{
    width: 0;
}


.mob_portfolio_fixed
{
    color: #fff;
    font-family: var(--font_family2);
    font-size: 21px;
    font-weight: 800;
    line-height: 23px;
    /*position: fixed;*/

    position: absolute;
    z-index: 102;
    right: 0;
    bottom: 0;

    display: none;

    width: 250px;
    padding: 15px 20px 30px;

    text-decoration: none;

    background: #287deb;
}

.mob_portfolio_fixed:before
{
    position: absolute;
    bottom: 0;
    left: -27px;

    display: block;

    width: 123px;
    height: 17px;

    content: '';
    transition: width .2s linear;

    background: #ffd200;
}



.main_blocks
{
    position: fixed;
    z-index: 90;
    top: 0;
    right: 0;

    width: calc(100% - var(--aside_width));
    height: 100%;
}

.main_blocks .scroll
{
    transition: transform .5s linear;
    transform: translateY(0);
}

.main_blocks .scroll.second
{
    transform: translateY(-100vh);
}

.main_blocks .first_screen,
.main_blocks .second_screen
{
    position: relative;
}



.scroll_down
{
    font-size: 13px;
    font-weight: 500;
    line-height: 19px;

    position: absolute;
    z-index: 99;
    top: 50%;
    left: 190px;

    margin-top: 125px;

    pointer-events: none;
}

.scroll_down_text
{
    -webkit-transition: all .4s ease;
       -moz-transition: all .4s ease;
         -o-transition: all .4s ease;
            transition: all .4s ease;

    opacity: 0;
}
.scroll_down_text.active_scroll
{
    opacity: 1;
}

.scroll_down .scroll_down_link
{
    position: absolute;
    top: 30px;
    left: -80px;

    display: block;

    padding-top: 112px;

    cursor: pointer;
    pointer-events: auto;

    border: none;
    background: none;
}

.scroll_down .scroll_down_link .arr
{
    position: relative;

    display: block;

    width: 36px;
    height: 36px;

    border-radius: 50%;
    background: #333;
}

.scroll_down .scroll_down_link .arr:before
{
    position: absolute;
    top: -112px;
    right: 0;
    left: 0;

    display: block;

    width: 2px;
    height: 126px;
    margin: auto;

    content: '';

    background: #8d8d8d;
}

.scroll_down .scroll_down_link .arr:after
{
    position: absolute;
    top: 14px;
    right: 0;
    left: 0;

    display: block;

    width: 8px;
    height: 7px;
    margin: auto;

    content: '';

    border-top: 7px solid #fff;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
}


.scroll_up
{
    font-size: 13px;
    font-weight: 500;
    line-height: 19px;

    position: absolute;
    z-index: 99;
    top: 275px;
    /*left: 55px;*/
    left: 190px;

    text-align: right;
    pointer-events: none;
}

.scroll_up .scroll_up_link
{
    position: absolute;
    top: -130px;
    /*right: -80px;*/
    left: -80px;

    display: block;

    padding-bottom: 112px;

    cursor: pointer;
    pointer-events: auto;

    border: none;
    background: none;
}

.scroll_up .scroll_up_link .arr
{
    position: relative;

    display: block;

    width: 36px;
    height: 36px;

    border-radius: 50%;
    background: #333;
}

.scroll_up .scroll_up_link .arr:before
{
    position: absolute;
    top: 21px;
    right: 0;
    left: 0;

    display: block;

    width: 2px;
    height: 126px;
    margin: auto;

    content: '';

    background: #8d8d8d;
}

.scroll_up .scroll_up_link .arr:after
{
    position: absolute;
    top: 15px;
    right: 0;
    left: 0;

    display: block;

    width: 8px;
    height: 7px;
    margin: auto;

    content: '';

    border-right: 4px solid transparent;
    border-bottom: 7px solid #fff;
    border-left: 4px solid transparent;
}



.products
{
    position: relative;

    display: flex;

    width: 100%;
    height: 100vh;
    /*height: calc(100vh - 20px);*/
    padding: 139px 360px;

    justify-content: center;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}

.products:before
{
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;

    display: block;

    width: 100%;
    height: 100%;
    content: '';
    pointer-events: none;
    /*background: url(../images/bg.png) calc(50% - var(--aside_width)/2) 0 no-repeat;*/

    background-image: url('../images/bg.png');
    background-repeat: no-repeat;
    background-position: calc(50% - var(--aside_width)/2) 0;
}


.products .cats
{
    position: relative;
    z-index: 5;

    width: 670px;
    max-width: 100%;

    counter-reset: item;
    pointer-events: none;
}

.products .cats > * + *
{
    margin-top: 50px;
}

.products .cats button,
.products .cats a
{
    color: var(--text_color);
    font-family: var(--font_family);
    font-size: 58px;
    line-height: 71px;

    position: relative;

    display: inline-block;

    padding-left: 105px;

    cursor: default;
    transition: .1s linear;
    vertical-align: top;
    pointer-events: auto;

    border: none;
    background: none;
}
.products .cats a
{
    cursor: pointer;
    text-decoration: none;
}
.products .cats a.first_products_link_mobile
{
    display: none;
}

.products .cats button:before,
.products .cats a:before
{
    font-weight: 200;

    position: absolute;
    top: 0;
    left: 0;

    content: counter(item, decimal-leading-zero);
    counter-increment: item;
    transition: .1s linear;
}

.products .cats button:hover,
.products .cats button.active,
.products .cats a:hover,
.products .cats a.active
{
    font-weight: 700;
}

.products .cats button:hover:before,
.products .cats button.active:before,
.products .cats a:hover:before,
.products .cats a.active:before
{
    font-weight: 500;
}


.products .product_rectangle,
.products .product_info
{
    position: absolute;
    top: 122px;
    bottom: 0;
    left: 50%;

    visibility: hidden;

    width: 325px;
    height: 566px;
    margin: auto;
    margin-left: -120px;

    transition: .5s linear;
    transform: scale(0);
    pointer-events: none;

    opacity: 0;
}

.products .product_rectangle.active,
.products .product_info.active
{
    visibility: visible;

    transform: scale(1);

    opacity: 1;
}


.products .product_rectangle
{
    z-index: 1;
}

.products .product_rectangle.color0
{
    background: #dea765;
}

.products .product_rectangle.color1
{
    background: #00cdff;
}

.products .product_rectangle.color2
{
    background: #14a5f5;
}

.products .product_rectangle.color3
{
    background: #287deb;
}

.products .product_rectangle.color4
{
    background: #3c55e1;
}

.products .product_rectangle.color5
{
    background: #502dd7;
}


.products .product_info
{
    z-index: 3;
}

.products .product_info img
{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;

    display: block;

    margin: auto;
}

.products .product_info2 img
{
    left: -200px;
}

.products .product_info3 img
{
    left: 65px;
}

.products .product_info4 img
{
    left: -200px;
}

.products .product_info5 img
{
    left: -50px;
}


.products .product_info .link
{
    color: var(--text_color);
    font-size: 20px;
    font-weight: 700;

    position: absolute;
    bottom: 25px;
    left: 25px;

    display: none;

    text-decoration: none;
    pointer-events: auto;

    justify-content: flex-start;
    align-items: center;
    align-content: center;
    flex-wrap: nowrap;
}

.products .product_info .link .arr
{
    position: relative;

    display: block;

    width: 68px;
    height: 2px;
    margin-left: 15px;

    background: var(--text_color);
}

.products .product_info .link .arr:after
{
    position: absolute;
    top: 0;
    right: -1px;
    bottom: 0;

    display: block;

    width: 7px;
    height: 8px;
    margin: auto;

    content: '';

    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
    border-left: 7px solid var(--text_color);
}



.second_screen:before
{
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;

    display: block;

    width: 100%;
    height: 100%;

    content: '';
    pointer-events: none;

    opacity: .65;
    background: url(../images/bg.png) calc(50% - 40px) 0 no-repeat;
}

.first_blocks_wrap
{
    position: relative;
    z-index: 100;
    z-index: 1;
    left: -161px;

    width: 870px;
    max-width: 100%;
    height: 20px;
    margin: 0 auto;
    /*padding: 145px 0 0;*/

    transition: .35s linear;
}

.blocks_wrap
{
    position: relative;
    z-index: 100;
    z-index: 1;
    left: -161px;

    width: 870px;
    max-width: 100%;
    height: 100vh;
    margin: 0 auto;
    padding: 145px 145px 0;

    transition: .35s linear;
}

.blocks_wrap.active
{
    /*z-index: 3;*/
    z-index: 99;
    left: 0;

    width: 100%;
}

.first_blocks
{
    display: flex;

    height: 100%;
    height: 20px;
    /* margin: 0 -145px; */

    transition: margin .35s linear;

    justify-content: flex-start;
    align-items: stretch;
    align-content: stretch;
    flex-wrap: nowrap;
}

.blocks
{
    display: flex;

    height: 100%;
    margin: 0 -145px;

    transition: margin .35s linear;

    justify-content: flex-start;
    align-items: stretch;
    align-content: stretch;
    flex-wrap: nowrap;
}

.blocks.active
{
    background: #ffc87d;
}

.blocks.active:before
{
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;

    display: block;

    width: 100%;
    height: 100%;

    content: '';
    pointer-events: none;

    opacity: .65;
    background: url('../images/bg.png') calc(50% - 40px) 0 no-repeat;
}

.blocks .block,
.first_blocks .block
{
    position: relative;
    z-index: 5;

    min-width: 145px;

    transition: .35s linear;

    flex-grow: 1;
}

.blocks.active .block.active
{
    z-index: 3;
}

.blocks.active .block:not(.active)
{
    flex-grow: 0;
}


.blocks .block.block1,
.first_blocks .block.block1
{
    background: #00cdff;
}

.blocks .block.block2,
.first_blocks .block.block2
{
    background: #14a5f5;
}

.blocks .block.block3,
.first_blocks .block.block3
{
    background: #287deb;
}

.blocks .block.block4,
.first_blocks .block.block4
{
    background: #3c55e1;
}

.blocks .block.block5,
.first_blocks .block.block5
{
    background: #502dd7;
}

.blocks .block.block6,
.first_blocks .block.block6
{
    background: #6405cd;
}

.blocks .block:hover
{
    background: #ffc87d;
}

.blocks .block.active
{
    background: transparent;
}


.blocks .block .intro
{
    color: #fff;

    position: absolute;
    z-index: 10;
    top: 0;
    left: 0;

    display: flex;

    width: 100%;
    height: 100%;
    padding: 30px 30px 275px;

    cursor: pointer;
    transition: .2s linear;

    justify-content: center;
    align-items: flex-end;
    align-content: flex-end;
    flex-wrap: wrap;
}

.blocks .block.active .intro
{
    visibility: hidden;

    opacity: 0;
}


.blocks .intro .name
{
    font-family: var(--font_family2);
    font-size: 25px;
    font-weight: 800;

    position: relative;

    display: flex;

    width: 100%;
    padding-top: 60px;

    transform: rotate(180deg);

    background: url(../images/ic_intro_arr.png) 50% 0 no-repeat;

            writing-mode: vertical-rl;
    -webkit-writing-mode: vertical-rl;
    justify-content: flex-start;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}


.blocks .intro .number
{
    font-size: 91px;
    font-weight: 300;
    line-height: 67px;

    position: absolute;
    right: 0;
    bottom: 0;

    padding: 40px 0;

    transform: rotate(180deg);

            writing-mode: vertical-rl;
    -webkit-writing-mode: vertical-rl;
}


.blocks .block_content
{
    position: relative;

    display: none;

    height: 100%;
    padding: 80px 60px 40px 100px;

    transition: .2s linear;
    pointer-events: none;
}

.blocks .block.active .block_content
{
    -webkit-animation: showBlock 1s;
            animation: showBlock 1s;
    pointer-events: auto;
}

@-webkit-keyframes showBlock
{
    0%
    {
        transform: translateY(100px);

        opacity: 0;
    }
    100%
    {
        transform: translateY(0);

        opacity: 1;
    }
}
@-moz-keyframes showBlock
{
    0%
    {
        transform: translateY(100px);

        opacity: 0;
    }
    100%
    {
        transform: translateY(0);

        opacity: 1;
    }
}
@keyframes showBlock
{
    0%
    {
        transform: translateY(100px);

        opacity: 0;
    }
    100%
    {
        transform: translateY(0);

        opacity: 1;
    }
}


.blocks .block_content .close
{
    position: absolute;
    top: 0;
    right: 0;

    display: none;

    width: 80px;
    height: 80px;
    padding: 22px;

    cursor: pointer;

    border: none;
    background: none;
	z-index: 1;

    justify-content: center;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}

.blocks .block.active .block_content .close
{
    display: flex;
}

.blocks .block_content .close span
{
    position: relative;

    display: block;

    width: 100%;
    height: 4px;

    transition: .2s linear;

    background: #333;
}

.blocks .block_content .close span + span
{
    margin-top: 6px;
}

.blocks .block_content .close span:nth-child(1)
{
    top: 5px;

    transform: rotate(45deg);
}

.blocks .block_content .close span:nth-child(2)
{
    top: -5px;

    transform: rotate(-45deg);
}


.blocks .block_content > .number
{
    color: #fff;
    font-size: 91px;
    font-weight: 300;
    line-height: 63px;

    position: absolute;
    top: -5px;
    left: 0;

    transform: rotate(180deg);

            writing-mode: vertical-rl;
    -webkit-writing-mode: vertical-rl;
}


.blocks .block_content .custom_scroll
{
    overflow: hidden;

    max-height: calc(100vh - 270px);
    padding-right: 48px;
}

.blocks .block_content .slimScrollBar
{
    opacity: 1 !important;
    border-radius: 0 !important;
}

.blocks .block_content .slimScrollRail
{
    opacity: .5 !important;
    border-radius: 0 !important;
}



.about_block > .number
{
    top: -11px !important;
}

.about_block .flex
{
    justify-content: space-between;
}


.about_block .col_left
{
    width: calc(50% - 10px);
}

.about_block .col_right
{
    width: calc(50% - 127px);
}


.about_block .block_title
{
    font-family: var(--font_family2);
    font-size: 58px;
    font-weight: 800;
    line-height: 71px;

    margin-bottom: 30px;
}


.about_block .img
{
    position: relative;

    margin-right: -60px;

    background: #fff;
}

.about_block .img img
{
    display: block;

    width: 100%;
}

.about_block .img img.stickers
{
    position: absolute;
    bottom: 0;
    left: 65px;

    display: block;

    width: auto;
    max-width: calc(100% - 130px);

    transform: translateY(35%);
}


.about_block .cats
{
    position: relative;
    z-index: 9;

    display: flex;

    margin-top: 85px;

    counter-reset: item;

    justify-content: space-between;
    align-items: flex-start;
    align-content: flex-start;
    flex-wrap: wrap;
}

.about_block .cats a
{
    color: var(--text_color);

    position: relative;

    display: flex;

    width: 98px;
    height: 98px;
    padding: 15px;

    transition: background .2s linear;

    border: 1px solid #fff;
    border-radius: 50%;

    justify-content: center;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}

.about_block .cats a:before
{
    font-size: 24px;

    position: absolute;
    top: 50%;
    left: 50%;

    content: counter(item, decimal-leading-zero);
    counter-increment: item;
}

.about_block .cats a .icon
{
    display: block;

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

    transition: fill .2s linear;

    fill: #fff;
}

.about_block .cats a .icon1
{
    width: 35px;
    height: 32px;
}

.about_block .cats a .icon2
{
    width: 35px;
    height: 35px;
}

.about_block .cats a .icon3
{
    width: 34px;
    height: 28px;
}

.about_block .cats a .icon4
{
    width: 35px;
    height: 33px;
}

.about_block .cats a .icon5
{
    width: 28px;
    height: 34px;
}

.about_block .cats a:hover
{
    background: #fff;
}

.about_block .cats a:hover .icon
{
    fill: #ffc87d;
}



.news_block .block_head
{
    position: relative;

    margin-bottom: 50px;
    padding-bottom: 40px;
}

.news_block .block_head:before
{
    position: absolute;
    bottom: 0;
    left: -100px;

    display: block;

    width: calc(100% + 160px);
    height: 1px;

    content: '';

    background: #333;
}

.news_block .block_head .title
{
    font-family: var(--font_family2);
    font-size: 58px;
    font-weight: 800;
}

.news_block .block_head .desc
{
    font-size: 25px;
    font-weight: 500;
    line-height: 35px;

    margin-top: 25px;
	width: 100%;
}


.news_block .flex
{
    margin-bottom: -45px;
    margin-left: -35px;
}

.news_block .flex > *
{
    width: calc(33.333% - 35px);
    margin-bottom: 45px;
    margin-left: 35px;
}

.news_block .item .title
{
    font-family: var(--font_family2);
    font-size: 25px;
    font-weight: 800;
    line-height: 29px;

    margin-bottom: 20px;
}

.news_block .item .list > * + *
{
    margin-top: 5px;
}

.news_block .item .list a
{
    color: var(--text_color);
    font-weight: 500;
    line-height: 23px;

    position: relative;

    display: inline-block;

    padding: 6px 0;

    transition: .2s linear;
    vertical-align: top;
    text-decoration: none;
}

.news_block .item .list img
{
    position: absolute;
    top: 50%;
    left: 100%;

    visibility: hidden;

    width: 193px;
    height: 129px;
    margin-top: -65px;
    margin-left: -25px;

    transition: .2s linear;
    pointer-events: none;

    opacity: 0;

    object-fit: cover;
	z-index: 1;
}

.news_block .item .list a:hover
{
    color: #fff;

    padding: 6px 18px;

    background: #14a5f5;
}

.news_block .item .list a:hover img
{
    visibility: visible;

    opacity: 1;
}

.news_block .item .link
{
    color: var(--text_color);

    position: relative;

    display: inline-block;

    width: 23px;
    height: 23px;
    margin-top: 15px;

    transition: .2s linear;
    vertical-align: top;

    border: 1px solid;
    border-radius: 50%;
}

.news_block .item .link:before,
.news_block .item .link:after
{
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;

    display: block;

    width: 11px;
    height: 1px;
    margin: auto;

    content: '';

    background: var(--text_color);
}

.news_block .item .link:after
{
    width: 1px;
    height: 11px;
}



.about_packaging .flex
{
    justify-content: space-between;
}


.about_packaging .col_left
{
    width: calc(50% - 54px);
}

.about_packaging .col_right
{
    width: calc(50% - 54px);
}


.about_packaging .block_title
{
    font-family: var(--font_family2);
    font-size: 58px;
    font-weight: 800;

    margin-bottom: 30px;
}


.about_packaging .img
{
    position: relative;

    margin-right: -60px;
    padding-bottom: 500px;

    background: #fff;
}

.about_packaging .img img
{
    position: absolute;
    bottom: 0;
    left: 0;

    display: block;

    width: 100%;
    min-width: 100px;
    min-height: 100px;
}

.about_packaging .img img.stickers
{
    position: absolute;
    bottom: -65px;
    left: 125px;

    display: block;

    width: auto;
    max-width: calc(100% - 250px);
}


.about_packaging .cats
{
    position: relative;
    z-index: 9;

    display: flex;

    margin-top: 85px;

    counter-reset: item;

    justify-content: space-between;
    align-items: flex-start;
    align-content: flex-start;
    flex-wrap: wrap;
}

.about_packaging .cats a
{
    color: var(--text_color);

    position: relative;

    display: flex;

    width: 98px;
    height: 98px;
    padding: 15px;

    transition: background .2s linear;

    border: 1px solid #fff;
    border-radius: 50%;

    justify-content: center;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}

.about_packaging .cats a:before
{
    font-size: 24px;

    position: absolute;
    top: 50%;
    left: 50%;

    content: counter(item, decimal-leading-zero);
    counter-increment: item;
}

.about_packaging .cats a .icon
{
    display: block;

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

    transition: fill .2s linear;

    fill: #fff;
}

.about_packaging .cats a .icon1
{
    width: 35px;
    height: 32px;
}

.about_packaging .cats a .icon2
{
    width: 35px;
    height: 35px;
}

.about_packaging .cats a .icon3
{
    width: 34px;
    height: 28px;
}

.about_packaging .cats a .icon4
{
    width: 35px;
    height: 33px;
}

.about_packaging .cats a .icon5
{
    width: 28px;
    height: 34px;
}

.about_packaging .cats a:hover
{
    background: #fff;
}

.about_packaging .cats a:hover .icon
{
    fill: #ffc87d;
}



.production_block .block_head
{
    position: relative;

    margin-bottom: 50px;
}

.production_block .block_head .title
{
    font-family: var(--font_family2);
    font-size: 58px;
    font-weight: 800;
}

.production_block .block_head .desc
{
    font-size: 25px;
    font-weight: 500;
    line-height: 35px;

    margin-top: 25px;
	width: 100%;
}


.production_block .titles
{
    margin-bottom: 50px;
}

.production_block .titles .slider:before
{
    position: absolute;
    z-index: 9;
    top: 0;
    /*right: 100%;*/
    left: -100px;

    display: block;
    /*width: 100px;*/

    width: 40px;
    height: 100%;

    content: '';

    /*background: #ffc87d;*/
}
.main_catalog_title_slider
{
    width: calc(100% + 100px);
}

.production_block .titles .owl-stage-outer
{
    /*overflow: visible !important;*/
}

.production_block .titles .slide
{
    display: flex;

    justify-content: flex-start;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}

.production_block .titles .owl-nav button.owl-next
{
    display: none !important;
}

.production_block .titles .title
{
    font-size: 50px;
    line-height: 56px;

    display: flex;

    white-space: nowrap;

    justify-content: flex-start;
    align-items: center;
    align-content: center;
    flex-wrap: nowrap;
}

.production_block .titles .number
{
    font-weight: 300;

    margin-right: 10px;
}

.production_block .titles .next
{
    display: block;

    margin-left: 25px;
    padding-left: 112px;

    cursor: pointer;
    pointer-events: auto;

    border: none;
    background: none;
}

.production_block .titles .next .arr
{
    position: relative;

    display: block;

    width: 36px;
    height: 36px;

    border-radius: 50%;
    background: #333;
}

.production_block .titles .next .arr:before
{
    position: absolute;
    top: 0;
    bottom: 0;
    left: -110px;

    display: block;

    width: 126px;
    height: 2px;
    margin: auto;

    content: '';

    background: #ac8c61;
}

.production_block .titles .next .arr:after
{
    position: absolute;
    top: 0;
    right: 14px;
    bottom: 0;

    display: block;

    width: 7px;
    height: 8px;
    margin: auto;

    content: '';

    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
    border-left: 7px solid #ffcb84;
}


.production_block .titles .active .title
{
    font-weight: 700;
}

.production_block .titles .active .number
{
    font-weight: 500;
}

.production_block .titles .active + .active .title
{
    font-weight: normal;
}

.production_block .titles .active + .active .number
{
    font-weight: 300;
}


.production_block .sub_cats .slider
{
    position: relative;

    width: 660px;
    max-width: 100%;
}

.production_block .sub_cats
{
    cursor: url('../images/ic_cursor.png') 45 45, auto;
}

.production_block .sub_cats:active
{
    cursor: url('../images/ic_cursor2.png') 45 45, auto;
}


.production_block .sub_cats .slider:before
{
    position: absolute;
    z-index: 9;
    top: 0;
    right: 100%;

    display: block;

    width: 100px;
    height: 100%;

    content: '';

    /*background: #ffc87d;*/
}

.production_block .sub_cats .owl-stage-outer
{
    overflow: visible !important;
}

.production_block .sub_cats .slide
{
    position: relative;
    /*min-height: 270px;*/

    height: 380px;
    padding: 60px;

    border: 1px solid #fff;
}

.production_block .sub_cats .list
{
    width: 60%;
}

.production_block .sub_cats .list > * + *
{
    margin-top: 2px;
}

.production_block .sub_cats .list a
{
    color: var(--text_color);
    font-weight: 500;
    line-height: 23px;

    display: inline-block;

    padding: 6px 0;

    transition: .2s linear;
    vertical-align: top;
    text-decoration: none;
}

.production_block .sub_cats .list a:hover
{
    color: #fff;

    padding: 6px 18px;

    background: #14a5f5;
}

.production_block .sub_cats .img
{
    position: absolute;
    top: 0;
    right: -78px;
    bottom: 0;

    display: block;

    max-width: 358px;
    height: 267px;
    max-height: calc(100% - 70px);
    margin: auto;
}

.main_product_slider_link
{
    color: var(--text_color);
    font-weight: 700;
    line-height: 23px;

    position: absolute;
    z-index: 5;
    bottom: -40px;
    left: 39px;

    display: none;

    text-decoration: none;
}

.main_product_slider_link:before
{
    position: absolute;
    z-index: -1;
    bottom: 0;
    left: -25px;

    display: block;

    width: 67px;
    height: 11px;

    content: '';
    transition: width .2s linear;

    background: #fff;
}




.services_block .flex
{
    justify-content: space-between;
}


.services_block .col_left
{
    width: calc(41.5% - 25px);
}

.services_block .col_right
{
    width: calc(58.5% - 25px);
}


.services_block .block_title
{
    font-family: var(--font_family2);
    font-size: 58px;
    font-weight: 800;

    margin-bottom: 30px;
}


.services_block .img
{
    position: relative;

    margin-right: -60px;

    background: #fff;
}

.services_block .img img
{
    display: block;

    width: 100%;
}


.services_block .list
{
    margin-top: -53px;
}

.services_block .list .title
{
    position: relative;

    margin-bottom: 60px;
}

.services_block .list .title:before
{
    position: absolute;
    top: 50%;
    left: -100px;

    display: block;

    width: calc(100% + 160px);
    height: 1px;

    content: '';

    background: #fff;
}

.services_block .list .title > *
{
    color: var(--text_color);
    font-weight: 500;
    line-height: 53px;

    position: relative;
    z-index: 5;

    display: inline-block;

    min-width: 247px;
    padding: 0 20px;

    vertical-align: top;

    background: #fff;
}

.services_block .list .items
{
    font-family: var(--font_family2);
    font-size: 25px;
    font-weight: 800;
    line-height: 29px;

    display: flex;

    margin-bottom: -20px;
    margin-left: -90px;

    justify-content: flex-start;
    align-items: flex-start;
    align-content: flex-start;
    flex-wrap: wrap;
}

.services_block .list .items > *
{
    margin-bottom: 20px;
    margin-left: 90px;
}



.contacts_block > .number
{
    top: -3px !important;
}

.contacts_block .flex
{
    justify-content: space-between;
}


.contacts_block .info
{
    width: 525px;
    max-width: 100%;
}

.contacts_block .info .block_title
{
    font-family: var(--font_family2);
    font-size: 58px;
    font-weight: 800;
    line-height: 71px;

    margin-bottom: 40px;
}

.contacts_block .info .title
{
    font-size: 25px;
    font-weight: 500;
    line-height: 35px;

    margin-bottom: 40px;
}

.contacts_block .info .item
{
    font-weight: 500;
    line-height: 23px;

    display: flex;

    justify-content: flex-start;
    align-items: flex-start;
    align-content: flex-start;
    flex-wrap: wrap;
}

.contacts_block .info .item + .item
{
    /*margin-top: 40px;*/
    margin-top: 25px;
}

.contacts_block .info .item .name
{
    width: 150px;
    padding-right: 20px;
}

.contacts_block .info .item .val
{
    width: calc(100% - 150px);
}

.contacts_block .info .item a
{
    color: var(--text_color);

    display: inline-block;

    vertical-align: top;
    white-space: nowrap;
    text-decoration: none;
}


.contacts_block .info .links
{
    position: relative;

    display: flex;

    /*margin-top: 90px;*/
    margin-top: 40px;

    justify-content: space-between;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}


.contacts_block .info .feedback_link
{
    color: var(--text_color);
    font-family: var(--font_family);
    font-size: 15px;
    font-weight: 500;

    display: inline-block;

    cursor: pointer;
    vertical-align: top;
    text-decoration: underline;

    border: none;
    background: none;
}

.contacts_block .info .feedback_link:hover
{
    text-decoration: none;
}


.contacts_block .info .socials
{
    position: absolute;
    left: calc(100% + 60px);

    display: flex;

    justify-content: flex-start;
    align-items: center;
    align-content: center;
    flex-wrap: nowrap;
}

.contacts_block .info .socials a
{
    display: block;
}

.contacts_block .info .socials a + a
{
    margin-left: 15px;
}

.contacts_block .info .socials img
{
    display: block;
}


.contacts_block .map
{
    /*width: calc(100% - 525px);
    height: 500px;
    margin-right: -60px;

    border: 44px solid #fff;
    background: #ddd;*/
	
	width: calc(100% - 525px);
	max-width: 945px;
	height: 500px;
	margin-right: 0;
	border: 44px solid #fff;
	background: #ddd;
	position: absolute;
	top: 80px;
	right: 0;
}

.contacts_block .tab {
	display: none;
}
.contacts_block .tab.is-active {
	display: block;
}
.contacts_block .tabs__nav {
	display: flex;
	margin-bottom: 40px;
}
.contacts_block .tabs__content {
	min-height: 155px;
}
.contacts_block .tabs__nav_item  {
	display: flex;
	height: 50px;
	padding: 15px 30px;
	cursor: pointer;
	transition: .2s linear;
	border: 3px solid #eb8c41;
	border-radius: 10px;
	background: transparent;
	justify-content: center;
	align-items: center;
	align-content: center;
	flex-wrap: wrap;
	margin-right: 15px;
}
.contacts_block .tabs__nav_item:last-child {
	margin-right: 0;
}
.contacts_block .tabs__nav_item.is-active {
	border: 3px solid transparent;
	background: #ffa055;
}


/*---------------
   Inner page
---------------*/
.inner_page
{
    width: 100%;
    min-height: 100%;
    padding: 148px 0 0 291px;
}

.inner_page.bg1
{
    background: #3c55e1;
}

.inner_page.bg2
{
    background: #6405cd;
}

.inner_page.bg3
{
    background: #ffc87d;
}

.inner_page.bg4
{
    background: #14a5f5;
}

.inner_content
{
    position: relative;
    z-index: 100;

    background: #f5f5f5;
}

.inner_content:before,
.inner_content:after
{
    position: absolute;
    z-index: -1;
    top: -148px;
    left: 50%;

    display: block;

    width: 1414px;
    height: 934px;
    margin-left: -852px;

    content: '';
    pointer-events: none;

    background: url(../images/bg.png) 0 0/100% 100% no-repeat;
}

.inner_content:after
{
    top: auto;
    bottom: 0;

    width: 1380px;
    height: 843px;
    margin-left: -835px;

    background: url(../images/bg2.png) 0 0/100% 100% no-repeat;
}



/*---------------
   Page head
---------------*/
.page_head
{
    position: relative;

    padding: 70px 100px 50px;
}


.breadcrumbs
{
    font-weight: 500;
    line-height: 23px;
}

.breadcrumbs a
{
    color: #ccc;

    transition: color .2s linear;
    white-space: nowrap;
    text-decoration: none;
}

.breadcrumbs a:hover
{
    color: var(--text_color);
}

.breadcrumbs .sep
{
    display: inline-block;

    margin: 0 7px;

    vertical-align: top;
}


.page_head .back_link
{
    color: var(--text_color);
    font-size: 13px;
    font-weight: 500;

    position: absolute;
    top: 60px;
    right: 100px;

    display: block;

    min-width: 142px;

    text-align: right;
    text-decoration: none;
}

.page_head .back_link .arr
{
    position: relative;

    display: block;

    width: 36px;
    height: 36px;
    margin-top: -4px;

    border-radius: 50%;
    background: #333;
}

.page_head .back_link .arr:before
{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 16px;

    display: block;

    width: 126px;
    height: 2px;
    margin: auto;

    content: '';

    border-left: 20px solid #ebebeb;
    background: #4d4d4d;
}

.page_head .back_link .arr:after
{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 15px;

    display: block;

    width: 7px;
    height: 8px;
    margin: auto;

    content: '';

    border-top: 4px solid transparent;
    border-right: 7px solid #ebebeb;
    border-bottom: 4px solid transparent;
}


.page_title
{
    font-family: var(--font_family2);
    font-size: 58px;
    font-weight: 900;
    line-height: 64px;

    display: block;
}

* + .page_title
{
    margin-top: 50px;
}


.page_desc
{
    font-size: 25px;
    font-weight: 500;
    line-height: 35px;

    margin-top: 20px;
}


.mob_product_name
{
    font-size: 36px;
    font-weight: 500;

    display: none;

    margin-top: 30px;
}



/*---------------
   Catalog
---------------*/
.catalog .tabs
{
    display: flex;

    padding: 10px 9px 0;

    border-top: 1px solid #333;

    justify-content: flex-start;
    align-items: stretch;
    align-content: stretch;
    flex-wrap: nowrap;
}

.catalog .tabs button
{
    color: var(--text_color);
    font-family: var(--font_family);
    font-size: 17px;
    font-weight: 500;
    line-height: 23px;

    position: relative;

    display: flex;

    width: 100%;
    height: 59px;
    padding: 10px 20px;

    cursor: pointer;
    transition: border-color .2s linear;
    text-align: center;

    border: 1px solid transparent;
    border-bottom: none;
    border-radius: 8px 8px 0 0;
    background: none;

    justify-content: center;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}

.catalog .tabs button:after
{
    position: absolute;
    bottom: 0;
    left: -10px;

    display: block;

    width: calc(100% + 20px);
    height: 1px;

    content: '';
    transition: background .2s linear;
    pointer-events: none;

    border-right: 9px solid #333;
    border-left: 9px solid #333;
    background: #333;
}

.catalog .tabs button + button
{
    margin-left: 9px;
}

.catalog .tabs button.active
{
    font-weight: 700;

    border-color: #333;
}

.catalog .tabs button.active:after
{
    background: transparent;
}

.catalog .tab_content
{
    position: relative;

    visibility: hidden;
    overflow: hidden;

    height: 0;

    pointer-events: none;

    opacity: 0;
}

.catalog .tab_content.active
{
    visibility: visible;
    overflow: visible;

    height: auto;

    transition: opacity .5s linear;
    pointer-events: auto;

    opacity: 1;
}



.catalog_products
{
    padding: 70px 100px;
}


.catalog_products .flex
{
    margin-bottom: -104px;
    margin-left: -104px;
}

.catalog_products .flex > *
{
    width: calc(33.333% - 104px);
    margin-bottom: 104px;
    margin-left: 104px;
}


.catalog_products .item
{
    color: var(--text_color);

    position: relative;

    display: block;

    text-decoration: none;

    background: #fff;
}

.catalog_products .item .thumb img
{
    display: block;

    width: 100%;
}

.catalog_products .item .name
{
	/*font-family: var(--font_family2);*/
	font-family: var(--font_family);
	font-size: 25px;
	font-weight: 700;
	line-height: 29px;

	position: absolute;
	top: 20px;
	left: -22px;
	z-index: 1;
}

.catalog_products .item .details
{
    font-size: 17px;
    font-weight: 700;

    position: absolute;
    z-index: 5;
    bottom: 37px;
    left: 7px;
}

.catalog_products .item .details:before
{
    position: absolute;
    z-index: -1;
    bottom: 0;
    left: -35px;

    display: block;

    width: 0;
    height: 11px;

    content: '';
    transition: width .2s linear;

    background: #ffd200;
}

.catalog_products .item:hover .details:before
{
    width: 78px;
}



/*------------------
    Product info
------------------*/
.product_info
{
    margin-bottom: 85px;
    padding: 0 100px;

    justify-content: space-between;
}


.product_info .images
{
    width: calc(50.56% - 60px);
    margin-right: auto;
}

.product_info .images .big .img
{
    position: relative;

    display: block;
    overflow: hidden;

    padding-bottom: 75%;

    background: #ddd;
}

.product_info .images .big .img img
{
    position: absolute;
    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    object-fit: cover;
}


.product_info .images .thumbs
{
    margin-top: 11px;
}

.product_info .images .thumbs .slide button
{
    position: relative;

    display: block;
    overflow: hidden;

    width: 100%;
    padding-bottom: 75%;

    cursor: pointer;

    border: none;
    background: #ddd;
}

.product_info .images .thumbs .slide button:after
{
    position: absolute;
    z-index: 3;
    top: 0;
    left: 0;

    display: block;

    width: 100%;
    height: 100%;

    content: '';
    transition: opacity .2s linear;

    opacity: .4;
    background: #fff;
}

.product_info .images .thumbs .slide button img
{
    position: absolute;
    top: 0;
    left: 0;

    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
}

.product_info .images .thumbs .slide button:hover:after,
.product_info .images .thumbs .slide.slick-current button:after
{
    opacity: 0;
}






.product_slider_thumbs, .news_slider_thumbs  {
	margin: 0 -6px;
}
.product_slider_thumbs .slide, .news_slider_thumbs .slide {
	margin: 0 6px;
	display: inline-block;
	float: none;
	vertical-align: top;
	white-space: normal;
}
.product_slider-nav {
	position: relative;
}
.product_slider-nav button {
	position: absolute;
	z-index: 10;
	top: 50%;
	display: block;
	overflow: visible;
	width: 56px;
    height: 70px;
    /*margin-top: -35px;*/
    margin-top: -110px;
    padding-right: 0;
	cursor: pointer;
	border: none;
	background: none;
	border: 0;
}


.product_slider-nav button.product_slider-prev
{
    left: -56px;
}

.product_slider-nav button.product_slider-next
{
	right: -56px;
	transform: rotate(-180deg);
}

.product_slider-nav button span
{
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 10px;

    width: 20px;
    height: 20px;
    margin: auto;

    transform: rotate(-45deg);

    border-top: 2px solid #333;
    border-left: 2px solid #333;
    border-radius: 0;
    background: none;
}

.product_slider-nav button span:before,
.product_slider-nav button span:after
{
    display: none;
}










.product_info .info
{
    overflow: auto;

    width: calc(49.3% - 60px);
    height: 640px;
    margin-left: auto;
    padding-right: 60px;

    scrollbar-color: #6405cd #e1e1e1;
    scrollbar-width: thin;
}

.product_info .info::-webkit-scrollbar
{
    width: 5px;
    height: 5px;

    background-color: #e1e1e1;
}

.product_info .info::-webkit-scrollbar-thumb
{
    background-color: #6405cd;
}


.product_info .product_name
{
    font-family: var(--font_family2);
    font-size: 33px;
    font-weight: 900;
    line-height: 37px;

    margin-bottom: 30px;
}



/*------------
    Scopes
------------*/
.scopes
{
    margin-bottom: 80px;
    padding: 0 100px;
}


.scopes .grid
{
    display: grid;

    padding: 1px;

    background: #333;

    grid-gap: 1px;
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: 300px;
}

.scopes .item.big
{
    grid-column: 1 / 3;
}

.scopes .item.big2
{
    grid-column: 3 / 5;
}

.scopes .item
{
    position: relative;

    padding: 35px;

    transition: background .2s linear;

    background: #f5f5f5;
}


.scopes .item .main_cat
{
    color: var(--text_color);
    font-family: var(--font_family2);
    font-size: 25px;
    font-weight: 800;
    line-height: 29px;

    display: flex;

    text-decoration: none;

    justify-content: space-between;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}

.scopes .item .main_cat .icon
{
    width: 60px;
}

.scopes .item .main_cat .icon > *
{
    display: block;

    fill: var(--text_color);
}

.scopes .item .main_cat .icon1 > *
{
    width: 45px;
    height: 40px;
}

.scopes .item .main_cat .icon2 > *
{
    width: 44px;
    height: 45px;
}

.scopes .item .main_cat .icon3 > *
{
    width: 44px;
    height: 35px;
}

.scopes .item .main_cat .icon4 > *
{
    width: 44px;
    height: 42px;
}

.scopes .item .main_cat .icon5 > *
{
    width: 37px;
    height: 45px;
}

.scopes .item .main_cat .name
{
    width: calc(100% - 80px);
}


.scopes .item .link
{
    color: var(--text_color);
    font-weight: 700;
    line-height: 23px;

    position: absolute;
    z-index: 5;
    bottom: 35px;
    left: 35px;

    display: block;

    text-decoration: none;
}

.scopes .item .link:before
{
    position: absolute;
    z-index: -1;
    bottom: 0;
    left: -25px;

    display: block;

    width: 0;
    height: 11px;

    content: '';
    transition: width .2s linear;

    background: #fff;
}


.scopes .item:hover
{
    background: #ffc87d;
}

.scopes .item:hover .link
{
    color: #000;
}

.scopes .item:hover .link:before
{
    width: 67px;
}



/*---------------------
    Products slider
---------------------*/
.products_slider
{
    margin-bottom: 80px;
    padding: 0 100px;
}


.products_slider .slider
{
    padding-right: 285px;
    padding-bottom: 80px;
}

.products_slider .owl-stage-outer, .products_slider .owl-stage-outer a
{
    overflow: visible !important;

    cursor: url('../images/ic_cursor.png') 45 45, auto;
}

.products_slider .owl-stage-outer:active, .products_slider .owl-stage-outer:active a
{
    cursor: url('../images/ic_cursor2.png') 45 45, auto;
}

.products_slider .owl-item
{
    visibility: hidden;

    transition: .2s linear;
    pointer-events: none;

    opacity: 0;
}

.products_slider .owl-item.active,
.products_slider .owl-item.active + .owl-item
{
    visibility: visible;

    pointer-events: auto;

    opacity: 1;
}


.products_slider .product
{
    color: var(--text_color);

    position: relative;

    display: block;

    text-decoration: none;

    background: #fff;
}

.products_slider .product .thumb img
{
    display: block;

    width: 100%;
}

.products_slider .product .name
{
    /*font-family: var(--font_family2);*/
    font-family: var(--font_family);
    font-size: 25px;
    font-weight: 400;
    line-height: 29px;

    position: absolute;
    top: 20px;
	left: -22px;
	/*width: min-content;*/
	max-width: 60%;
	display: table-caption;
}

.products_slider .product .details
{
    font-size: 17px;
    font-weight: 700;

    position: absolute;
    z-index: 5;
    bottom: 37px;
    left: 7px;
}

.products_slider .product .details:before
{
    position: absolute;
    z-index: -1;
    bottom: 0;
    left: -20px;

    display: block;

    width: 78px;
    height: 11px;

    content: '';
    transition: width .2s linear;

    background: #ffd200;
}

.products_slider .product:hover .details:before
{
    width: 0;
}



/*-----------------
    Order block
-----------------*/
.order_block
{
    margin-bottom: 80px;
    padding: 0 100px;
}


.order_block .info
{
    width: 605px;
    max-width: calc(50% - 65px);
}

.order_block .info .title
{
    font-family: var(--font_family2);
    font-size: 25px;
    font-weight: 900;
}

.order_block .info .desc
{
    font-size: 17px;
    font-weight: 500;
    line-height: 23px;

    margin-top: 25px;
}

.order_block .info .exp
{
    font-size: 13px;
    font-weight: 500;
    line-height: 17px;

    margin-top: 195px;
}


.order_block .form
{
    width: 450px;
    max-width: calc(50% - 65px);
    margin-left: 130px;

    --form_border_color: #d7d7d7;
    --form_bg_color: transparent;
}



/*----------------
    Scope info
----------------*/
.scope_info
{
    position: relative;

    margin: 0 100px;
    padding-top: 50px;

    border-top: 1px solid #333;
}


.scope_info .scope_links
{
    position: absolute;
    top: 0;
    right: 100%;

    margin-right: 100px;
	
	height: 100%;
	z-index: 99;
}

.scope_info .scope_links > * + *
{
    margin-top: 10px;
}

.scope_info .scope_links button
{
    display: flex;

    width: 92px;
    height: 92px;
    padding: 15px;

    cursor: pointer;
    transition: .2s linear;

    border: none;
    border-right: 3px solid #eb8c41;
    border-radius: 10px 0 0 10px;
    background: #ffa055;

    justify-content: center;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}

.scope_info .scope_links .icon > *
{
    display: block;

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

    transition: fill .2s linear;

    fill: #ffc479;
}

.scope_info .scope_links .icon1 > *
{
    width: 45px;
    height: 40px;
}

.scope_info .scope_links .icon2 > *
{
    width: 44px;
    height: 45px;
}

.scope_info .scope_links .icon3 > *
{
    width: 44px;
    height: 35px;
}

.scope_info .scope_links .icon4 > *
{
    width: 44px;
    height: 42px;
}

.scope_info .scope_links .icon5 > *
{
    width: 37px;
    height: 45px;
}

.scope_info .scope_links abutton:hover,
.scope_info .scope_links button.active
{
    border-color: transparent;
    background: #fff;
}

.scope_info .scope_links button:hover .icon > *,
.scope_info .scope_links button.active .icon > *
{
    fill: var(--text_color);
}


.scope_info .mob_tab_name
{
    color: var(--text_color);
    font-family: var(--font_family2);
    font-size: 25px;
    font-weight: 800;
    line-height: 29px;

    position: relative;

    display: none;

    width: 100%;
    padding: 30px 40px 30px 0;

    cursor: pointer;
    text-align: left;

    border: none;
    background: none;

    justify-content: space-between;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}

.scope_info .mob_tab_name ~ .mob_tab_name
{
    margin-top: 5px;

    border-top: 1px solid #333;
}

.scope_info .mob_tab_name.active + .tab_content + .mob_tab_name
{
    margin-top: 30px;
}

.scope_info .mob_tab_name .icon
{
    width: 45px;
}

.scope_info .mob_tab_name .icon > *
{
    display: block;

    margin: 0 auto;

    fill: var(--text_color);
}

.scope_info .mob_tab_name .icon1 > *
{
    width: 45px;
    height: 40px;
}

.scope_info .mob_tab_name .icon2 > *
{
    width: 44px;
    height: 45px;
}

.scope_info .mob_tab_name .icon3 > *
{
    width: 44px;
    height: 35px;
}

.scope_info .mob_tab_name .icon4 > *
{
    width: 44px;
    height: 42px;
}

.scope_info .mob_tab_name .icon5 > *
{
    width: 37px;
    height: 45px;
}

.scope_info .mob_tab_name .name
{
    width: calc(100% - 75px);
}

.scope_info .mob_tab_name .toggle_icon
{
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;

    display: block;

    width: 23px;
    height: 23px;
    margin: auto;

    border-radius: 50%;
    background: #333;
}

.scope_info .mob_tab_name .toggle_icon:before,
.scope_info .mob_tab_name .toggle_icon:after
{
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;

    display: block;

    width: 9px;
    height: 1px;
    margin: auto;

    content: '';

    background: #fff;
}

.scope_info .mob_tab_name .toggle_icon:after
{
    width: 1px;
    height: 9px;

    transition: opacity .2s linear;
}

.scope_info .mob_tab_name.active .toggle_icon:after
{
    opacity: 0;
}


.scope_info .tab_content
{
    position: relative;

    visibility: hidden;
    overflow: hidden;

    height: 0;

    pointer-events: none;

    opacity: 0;
}

.scope_info .tab_content.active
{
    visibility: visible;
    overflow: visible;

    height: auto;

    transition: opacity .5s linear;
    pointer-events: auto;

    opacity: 1;
}

.scope_info .tab_content > * + *
{
    margin-top: 60px;
}

.scope_info .tab_content ~ .text_block
{
    margin-top: 30px;
}


.scope_info .scope_name
{
    color: var(--text_color);
    font-family: var(--font_family2);
    font-size: 25px;
    font-weight: 800;
    line-height: 29px;

    display: flex;

    margin-top: 0;

    justify-content: flex-start;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}

.scope_info .scope_name .icon
{
    width: 145px;
}

.scope_info .scope_name .icon > *
{
    display: block;

    margin: 0 auto;

    fill: var(--text_color);
}

.scope_info .scope_name .icon1 > *
{
    width: 45px;
    height: 40px;
}

.scope_info .scope_name .icon2 > *
{
    width: 44px;
    height: 45px;
}

.scope_info .scope_name .icon3 > *
{
    width: 44px;
    height: 35px;
}

.scope_info .scope_name .icon4 > *
{
    width: 44px;
    height: 42px;
}

.scope_info .scope_name .icon5 > *
{
    width: 37px;
    height: 45px;
}

.scope_info .scope_name .name
{
    width: calc(100% - 145px);
}



.scope_info .products_slider
{
    margin-bottom: 0;
    padding: 0;
}


.scope_info .scope_products .title
{
    font-family: var(--font_family2);
    font-size: 25px;
    font-weight: 900;
    line-height: 29px;

    margin-bottom: 30px;
}


.scope_info .scope_products .list > * + *
{
    margin-top: 12px;
}

.scope_info .scope_products .list a
{
    color: var(--text_color);
    font-size: 17px;
    font-weight: 500;
    line-height: 23px;

    display: flex;

    text-decoration: none;

    justify-content: space-between;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}

.scope_info .scope_products .list .link
{
    display: flex;

    transition: opacity .2s linear;

    opacity: 0;

    justify-content: flex-start;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}

.scope_info .scope_products .list .link span
{
    position: relative;

    width: 69px;
    height: 1px;
    margin-left: 35px;

    background: currentColor;
}

.scope_info .scope_products .list .link span:after
{
    position: absolute;
    top: 0;
    right: -2px;
    bottom: 0;

    display: block;

    width: 7px;
    height: 8px;
    margin: auto;

    content: '';

    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
    border-left: 7px solid currentColor;
}

.scope_info .scope_products .list a:hover .name
{
    font-weight: 700;
}

.scope_info .scope_products .list a:hover .link
{
    opacity: 1;
}


.scope_info .scope_products .text_block
{
    margin-top: 40px;
}



/*--------------
    Articles
--------------*/
.articles
{
    position: relative;

    margin: 0 100px;
    padding-top: 50px;

    border-top: 1px solid #333;
}

.articles > * + *
{
    margin-top: 60px;
}

.articles .block_head
{
    margin-bottom: 25px;
}


.articles .article
{
    position: relative;
}

.articles .article:before
{
    position: absolute;
    top: 26px;
    left: 11px;

    display: block;

    width: 1px;
    height: calc(100% - 51px);

    content: '';
    transition: opacity .2s linear;

    opacity: 0;
    background: currentColor;
}

.articles .article:after
{
    position: absolute;
    top: 3px;
    left: 0;

    display: block;

    width: 23px;
    height: 23px;

    content: '';
    transition: opacity .2s linear;

    opacity: 0;
    border-radius: 50%;
    background: currentColor;
}

.articles .article + .article
{
    margin-top: 15px;
}


.articles .article .head
{
    line-height: 28px;

    display: flex;

    padding-left: 51px;

    cursor: pointer;

    justify-content: space-between;
    align-items: flex-start;
    align-content: flex-start;
    flex-wrap: nowrap;
}

.articles .article .head .icon
{
    position: absolute;
    top: 3px;
    left: 0;

    display: block;

    width: 23px;
    height: 23px;

    transition: .2s linear;

    border: 1px solid;
    border-radius: 50%;
}

.articles .article .head .icon:before,
.articles .article .head .icon:after
{
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;

    display: block;

    width: 9px;
    height: 1px;
    margin: auto;

    content: '';

    background: currentColor;
}

.articles .article .head .icon:after
{
    width: 1px;
    height: 9px;

    transition: opacity .2s linear;
}

.articles .article .head .name
{
    font-size: 25px;
    font-weight: 500;
}

.articles .article .head .date
{
    font-size: 16px;
    font-weight: 500;

    margin-left: 30px;
}

.articles .article .data
{
    display: none;
}



.articles .article.active + .article
{
    margin-top: 40px;
}

.articles .article.active .head .name
{
    font-family: var(--font_family2);
    font-weight: 900;
}

.articles .article.active .head .date
{
    font-weight: 700;
}

.articles .article.active:before,
.articles .article.active:after
{
    opacity: 1;
}

.articles .article.active .head .icon
{
    top: 100%;

    margin-top: -25px;
}

.articles .article.active .head .icon:after
{
    opacity: 0;
}



/*------------------
    Article info
------------------*/
.article_info
{
    padding-top: 35px;
    padding-left: 51px;

    justify-content: space-between;
}


.article_info .info
{
    overflow: auto;

    width: calc(49.3% - 60px);
    height: 633px;
    padding-right: 60px;

    scrollbar-color: #14a5f5 #e1e1e1;
    scrollbar-width: thin;
}

.article_info .info::-webkit-scrollbar
{
    width: 5px;
    height: 5px;

    background-color: #e1e1e1;
}

.article_info .info::-webkit-scrollbar-thumb
{
    background-color: #14a5f5;
}

.article_info .info .text_block
{
    text-align: left;
}


.article_info .images
{
    width: calc(50.56% - 60px);
}

.article_info .images .big .img
{
    position: relative;

    display: block;
    overflow: hidden;

    padding-bottom: 75%;

    background: #ddd;
}

.article_info .images .big .img img
{
    position: absolute;
    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    object-fit: cover;
}


.article_info .images .thumbs
{
    margin-top: 11px;
	margin-right: -11px;
}

.article_info .images .thumbs .slide {
	margin-right: 11px;
}

.article_info .images .thumbs .slide button
{
    position: relative;

    display: block;
    overflow: hidden;

    width: 100%;
    padding-bottom: 75%;

    cursor: pointer;

    border: none;
    background: #ddd;
}

.article_info .images .thumbs .slide button:after
{
    position: absolute;
    z-index: 3;
    top: 0;
    left: 0;

    display: block;

    width: 100%;
    height: 100%;

    content: '';
    transition: opacity .2s linear;

    opacity: .4;
    background: #fff;
}

.article_info .images .thumbs .slide button img
{
    position: absolute;
    top: 0;
    left: 0;

    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
}

.article_info .images .thumbs .slide button:hover:after,
.article_info .images .thumbs .slide.slick-current button:after
{
    opacity: 0;
}

.thumbs_wrapper {
	position: relative;
}

.thumbs_wrapper .news_slider_arrow > div
{
    width: 56px;
    height: 70px;
    margin-top: -35px;
    padding-right: 0;
	position: absolute;
    z-index: 1;
	top: 50%;
	cursor: pointer;
}

.thumbs_wrapper .news_slider_arrow .arrow_prev
{
    left: -56px;
}

.thumbs_wrapper .news_slider_arrow .arrow_next
{
    right: -56px;
	transform: rotate(-180deg);
}

.thumbs_wrapper .news_slider_arrow span
{
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 10px;

    width: 20px;
    height: 20px;
    margin: auto;

    transform: rotate(-45deg);

    border-top: 2px solid #333;
    border-left: 2px solid #333;
    border-radius: 0;
    background: none;
}



/*----------------
    Other Products
----------------*/
.other_product_page {
	background-image: url('../images/other_product_bg.png');
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: 100%;
}
.other_product_page:before {
	/*background: none;*/
}
.op_title_wrapper {
	margin-top: 18vw;
}
.other_product_page .page_title {
	/*color: #fff;*/
}
.other_product_page .articles {
	/*border-top: 1px solid #fff;*/
}
.op_description {
	font-size: 25px;
	font-weight: 500;
	/*color: #fff;*/
	line-height: 1.4;
	/*padding-bottom: 90px;*/
}
.op_content_wraper {
	margin-top: 50px;
}
.op_table {
	display: flex;
	flex-direction: column;
	gap: 3px;
	font-weight: 500;
	margin-top: 25px;
}
.op_table_name, .op_table_name2 {
	display: flex;
	width: 100%;
	gap: 3px;
	font-weight: 600;
	font-size: 12.5px;
}
.op_table_name > div, .op_table_name2 > div {
	padding: 15px 0;
	text-align: left;
}
.op_table_name div:nth-child(1), .op_table_name2 div:nth-child(1) {
	flex: 1 0 calc(40% - 3px);
}
.op_table_name div:nth-child(2),
.op_table_name div:nth-child(3),
.op_table_name div:nth-child(4),
.op_table_name div:nth-child(5) {
	flex: 1 0 calc(15% - 3px);
}
.op_table_name2 div:nth-child(2),
.op_table_name2 div:nth-child(3) {
	flex: 1 0 calc(30% - 3px);
}
.op_table_row {
	display: flex;
	width: 100%;
	gap: 3px;
}
.op_name, .op_ingredients {
	flex: 1 0 calc(40% - 3px);
	background: #ffd79b;
	padding: 25px 50px;
	display: flex;
    align-items: center;
}
.op_caliber, .op_color, .op_adhesion, .oc_stock {
	flex: 1 0 calc(15% - 3px);
	background: #fff;
	text-align: center;
	padding: 25px 20px;
	display: flex;
    align-items: center;
    justify-content: center;
}
.op_thickness, .op_width {
	flex: 1 0 calc(30% - 3px);
	background: #fff;
	text-align: center;
	padding: 25px 20px;
	display: flex;
    align-items: center;
    justify-content: center;
}

.scope_section {
	display: flex;
	justify-content: space-between;
	counter-reset: item;
}
.scope_wapper {
	display: flex;
	gap: 25px;
}
.scope_item {
	position: relative;
	display: flex;
	width: 98px;
	height: 98px;
	background: transparent;
	transition: background .2s linear, border-color .2s linear;
	border: 1px solid #000;
	border-radius: 50%;
	overflow: hidden;
}
.scope_item:hover {
	background: #00cdff;
	border-color: #00cdff;
}
.scope_icon {
	width: 35px;
	height: 45px;
}
.scope_icon svg {
	width: 100%;
	height: 100%;
	fill: #ffc87d;
	transition: fill .2s linear;
}
.scope_item:hover svg {
	fill: #fff;
}
.scope_item a {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	color: #000;
	text-decoration: none;
}
.scope_item:before {
	font-size: 24px;
	position: absolute;
	top: 50%;
	left: 50%;
	content: counter(item, decimal-leading-zero);
	counter-increment: item;
}

.op_advantages_wrapper {
	display: flex;
}
.op_advantages_wrapper h2 {
	flex: 1 0 40%;
}
.op_advantages {
	width: 60%;
	font-weight: 500;
}
.op_advantages_list {
	list-style: none;
}
.op_advantages_list li {
	position: relative;
}
.op_advantages_list li:before {
	content: '— ';
}




/*----------------
    Block head
----------------*/
.block_head
{
    display: flex;

    width: 100%;
    margin-bottom: 50px;

    justify-content: flex-start;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}


.block_head .title, h2
{
    font-family: var(--font_family2);
    font-size: 33px;
    font-weight: 900;
    line-height: 38px;
}


.block_head .reset_btn
{
    color: var(--text_color);
    font-family: var(--font_family);
    font-size: 16px;
    font-weight: 700;
    line-height: 23px;

    margin-left: auto;

    cursor: pointer;

    border: none;
    background: none;
}



/*---------------
   footer
---------------*/
footer
{
    margin-top: 80px;
    padding: 40px 100px;

    border-top: 1px solid #333;
}

footer .flex
{
    justify-content: space-between;
}


footer .logo
{
    font-size: 16px;
    font-weight: 500;
    line-height: 23px;

    display: flex;

    min-height: 64px;
    margin-top: -7px;
    padding-left: 70px;

    background: url(../images/logo_color.png) 0 50% no-repeat;

    justify-content: flex-start;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}

footer .logo b
{
    font-family: var(--font_family2);
    font-weight: 800;
}



footer .copyright
{
    font-size: 13px;
    font-weight: 500;
    line-height: 23px;

    margin-top: 35px;
}



footer .menu.mob_show
{
    display: none;
}

footer .menu a
{
    color: var(--text_color);
    font-size: 16px;
    font-weight: 500;
    line-height: 23px;

    display: inline-block;

    vertical-align: top;
    text-decoration: none;
}

footer .menu a:hover
{
    text-decoration: underline;
}



footer .contacts
{
    font-size: 16px;
    font-weight: 500;
    line-height: 23px;
}

footer .contacts > * + *
{
    /*margin-top: 23px;*/
    margin-top: 0px;
}

footer .contacts .phone a
{
    color: var(--text_color);

    display: inline-block;

    vertical-align: top;
    white-space: nowrap;
    text-decoration: none;
}



footer .feedback_link
{
    color: var(--text_color);
    font-family: var(--font_family);
    font-size: 16px;
    font-weight: 500;
    line-height: 23px;

    display: inline-block;

    cursor: pointer;
    vertical-align: top;
    text-decoration: underline;

    border: none;
    background: none;
}

footer .feedback_link:hover
{
    text-decoration: none;
}

footer .feedback_link span + span
{
    display: none;
}


footer .socials
{
    display: flex;

    margin-top: 20px;

    justify-content: flex-start;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}

footer .socials a,
footer .socials img
{
    display: block;
}

footer .socials a + a
{
    margin-left: 15px;
}


footer .creator
{
    color: var(--text_color);
    font-size: 13px;
    font-weight: 500;
    line-height: 23px;

    display: inline-block;

    margin-top: 29px;

    vertical-align: top;
    text-decoration: none;
}

footer .creator b
{
    text-decoration: underline;
}



/*---------------
   PopUp
---------------*/
.modal
{
    display: none;
    visibility: visible !important;

    width: 1485px;
    max-width: 100%;
    padding: 140px 240px 80px 290px;

    background: #fff;
}

.modal > .flex
{
    display: flex;

    justify-content: space-between;
    align-items: flex-start;
    align-content: flex-start;
    flex-wrap: wrap;
}


.modal .sub_title
{
    font-weight: 500;
    line-height: 23px;

    position: absolute;
    top: 0;
    left: 0;

    display: flex;

    min-height: 58px;
    padding: 10px 40px 10px 60px;

    background: #ffc87d;

    justify-content: flex-start;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}

.modal .sub_title:before
{
    position: absolute;
    z-index: 2;
    top: 0;
    bottom: 0;
    left: 21px;

    display: block;

    width: 17px;
    height: 17px;
    margin: auto;

    content: '';
    transition: background .2s linear;

    border-radius: 50%;
    background: #333;
}


.modal_head
{
    width: 310px;
    max-width: 100%;
}

.modal_head .title
{
    font-family: var(--font_family2);
    font-size: 25px;
    font-weight: 800;
}

.modal_head .desc
{
    font-weight: 500;
    line-height: 23px;

    margin-top: 25px;
}

.modal_head .desc * + *
{
    margin-top: 20px;
}

.modal_head .desc small
{
    font-size: 13px;
    line-height: 19px;
}


.modal_data
{
    width: 460px;
    max-width: 100%;
}
