.n-nan-top-banner {
    background-color: #55BEC4;
}

@media screen and (max-width: 767px) {
    .n-nan-top-banner {
        background-color: #fff;
    }
}

.n-nan-top-banner__wrapper {
    background: url(/new/static/brands/nan/images/bg_top_mob.png) no-repeat;
    background-size: contain;
    animation: bannerChange 20s infinite;
    position: relative;
}

@media screen and (max-width: 767px) {
    .n-nan-top-banner__wrapper {
        animation: none;
    }
}

@media screen and (max-width: 767px) {
    .n-nan-top-banner__wrapper:before {
        content: '';
        position: absolute;
        bottom: 730px;
        right: 0;
        width: 100%;
        height: 100%;
        background: url(/new/static/brands/nan/images/bg_blocks.jpg) no-repeat;
        background-position: right bottom;
        background-size: 851px auto;
    }
}

@media screen and (max-width: 767px) {
    .n-nan-top-banner__wrapper::after {
        content: '';
        position: absolute;
        display: block;
        left: 0;
        top: 0;
        z-index: 1;
        background: linear-gradient(0deg, #fff 30%, rgba(16, 24, 32, 0) 40%) no-repeat center center/auto 80%;
        width: 100%;
        height: 550px;

    }
}

.n-nan-top-banner__content {
    padding: 24px 20px 0;
    max-width: 1310px;
    margin: 0 auto;
}

@media screen and (max-width: 767px) {
    .n-nan-top-banner__content {
        display: flex;
        flex-direction: column;
        margin: 0 auto;
        padding-top: 220px;
        position: relative;
        z-index: 2;
    }
}
@media screen and (max-width: 480px) {
    .n-nan-top-banner__content {
        padding-top: 160px;
    }
}


.second_slide_text {
    color: #fff;
    font-family: 'istok_webbold', Arial, Helvetica, sans-serif;
    font-size: 30px;
    line-height: 43px;
    position: absolute;
    top: 13%;
    right: 16%;
    text-align: center;
    text-transform: uppercase;
    animation: hideText 20s infinite;
}

@media screen and (max-width: 1259px) {
    .second_slide_text {
        right: auto;
        left: 58%;
        width: 300px;
    }
}

@media screen and (max-width: 767px) {
    .second_slide_text {
        display: none;
    }
}

.n-nan-top-banner__wrapper.second_slide .second_slide_text {
    display: block;
    animation: showText 2.5s forwards;
}

.n-nan-top-banner__title {
    position: relative;
    margin-top: 6px;
}

.n-nan-top-banner__h1 {
    font-family: 'istok_webbold', Arial, Helvetica, sans-serif;
    font-size: 36px;
    line-height: 40px;
    text-transform: uppercase;
    color: #0C3B9B;
}

@media screen and (max-width: 767px) {
    .n-nan-top-banner__h1 {
        font-size: 24px;
        line-height: 30px;
        margin: 14px auto;
    }
}

.n-nan-top-banner__button-box-title {
    margin-top: 12px;
    font-size: 18px;
    line-height: 21px;
    color: #B99847;
    font-family: 'istok_webbold', Arial, Helvetica, sans-serif;
    letter-spacing: 0.02em;
    margin-right: 4px;
}

@media screen and (max-width: 767px) {
    .n-nan-top-banner__button-box-title {
        display: none;
    }
}

.n-nan-top-banner__button-box-title_mob {
    display: none;
}

@media screen and (max-width: 767px) {
    .n-nan-top-banner__button-box-title_mob {
        display: block;
    }
}

.n-nan-top-banner__item {
    max-width: 528px;
    text-align: center;
}

@media screen and (max-width: 1023px) {
	.n-nan-top-banner__item {
		max-width: 436px;
	}
}

@media screen and (max-width: 767px) {
    .n-nan-top-banner__item {
        max-width: none;
    }
}

.n-nan-top-banner__packs {
    margin-top: 14px;
    /* padding-left: 16px; */
	max-width: 528px;
}

.n-nan-top-banner__packs img {
    max-width: 100%;
    height: auto;
}

@media screen and (max-width: 1023px) {
	.n-nan-top-banner__packs {
		max-width: 436px;
	}
}

@media screen and (max-width: 767px) {
    .n-nan-top-banner__packs {
        order: 1;
        /* max-width: 260px; */
        margin: auto;
    }
}

@media screen and (max-width: 480px) {
	.n-nan-top-banner__packs {
		max-width: none;
		margin-left: -24px;
		margin-right: -24px;
	}
}

@media screen and (max-width: 767px) {
    .n-nan-top-banner__info {
        width: 100%;
        order: 3;
    }
}

@media screen and (max-width: 767px) {
    .n-nan-top-banner__buttons {
        order: 2;
    }
}



.n-nan-top-banner__button-box {
    display: flex;
    justify-content: center;
    /* gap: 18px; */
    /* padding-right: 18px; */
    margin-top: 6px;
}

.n-nan-top-banner__button-box a {
    font-size: 12px;
    padding: 5px 14px;
    line-height: 15px;
}

.n-nan-top-banner__button-box a:nth-child(1) {
    margin: -12px 0 12px;
	margin-right: 16px;
}
.n-nan-top-banner__button-box a:nth-child(2) {
	margin-right: 22px;
}
.n-nan-top-banner__button-box a:nth-child(3) {
    margin: -12px 0 12px;
}

@media screen and (max-width: 480px) {
	.n-nan-top-banner__button-box a:nth-child(1) {
		margin-right: 0;
	}
	.n-nan-top-banner__button-box a:nth-child(2) {
		margin-right: 0;
	}

	.n-nan-top-banner__button-box {
		position: relative;
		width: 100%;
		margin-bottom: 40px;
	}
	.n-nan-top-banner__button-box a {
		position: absolute;
		width: 32.5%;
		max-width: 113.67px;
		top: 0;
	}
	.n-nan-top-banner__button-box a:nth-child(1) {
		left: 16%;
		transform: translateX(-50%);
	}
	.n-nan-top-banner__button-box a:nth-child(2) {
		left: 50%;
		transform: translateX(-50%);
	}
	.n-nan-top-banner__button-box a:nth-child(3) {
		left: 84%;
		transform: translateX(-50%);
	}
}

.n-nan-top-banner__button-box-title:before {
    content: '';
    position: relative;
    display: inline-block;
    vertical-align: bottom;
    background: url(/new/static/brands/nan/images/check.svg) no-repeat center;
    background-size: contain;
    width: 26px;
    height: 23px;
    margin-right: 4px;
}

.wrapper--content {
    margin: auto;
}

.n-nan-top-banner__block {
    padding: 20px 30px 30px;
    margin: 23px auto 0;
    border-radius: 15px;
    background-color: #fff;
}

@media screen and (max-width: 767px) {
    .n-nan-top-banner__block {
        margin-top: 0;
        padding-top: 10px;
    }
}

.n-nan-top-banner__components_header {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
    margin: 10px auto 20px;
}

@media screen and (max-width: 767px) {
    .n-nan-top-banner__components_header {
        flex-direction: column;
        align-items: center;
        position: relative;
        z-index: 2;
    }
}

.n-nan-top-banner__components_header a {
    max-width: max-content;
}

.n-nan-top-banner__components {
    display: flex;
    justify-content: space-between;
}

@media screen and (max-width: 767px) {
    .n-nan-top-banner__components {
        flex-direction: column;
        align-items: center;
        gap: 10px;
        position: relative;
    }
}

.n-nan-top-banner-components-item {
    text-align: center;
    display: flex;
    align-items: center;
    width: calc((100% - 60px) / 3);
    gap: 5px;
}

@media screen and (max-width: 767px) {
    .n-nan-top-banner-components-item {
        width: 320px;
    }
}

.n-nan-top-banner-components-item__description {
    flex-grow: 1;
    flex-shrink: 1;
}

.n-nan-top-banner-components-item__description img {
    max-width: 100%;
    height: auto;
    width: 129px;
}

.n-nan-top-banner-components-item__label.n-nan-top-banner-components-item__label--3 {
    width: 84px;
}

.n-nan-top-banner-components-item__text {
    font-size: 18px;
    line-height: 21px;
    color: #29adb9;
    font-family: "istok_webbold", Arial, Helvetica, sans-serif;
    position: relative;
    margin-top: 2px;
    padding-top: 5px;
}

.n-nan-top-banner-components-item__text:before {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, 0);
    width: 78px;
    height: 2px;
    background: #b99847;
}

.b-brand {
    padding-bottom: 40px;
    position: relative;
}

@media screen and (max-width: 767px) {
    .b-brand {
        padding: 0;
    }
}

.b-brand__title {
    font-family: "istok_webbold", Arial, Helvetica, sans-serif;
    font-size: 36px;
    line-height: 52px;
    color: #fff;
    text-align: center;
    margin: 16px 0;
}

@media screen and (max-width: 767px) {
    .b-brand__title {
        color: #0C3B9B;
        font-size: 30px;
        line-height: 34px;
    }
}

.b-brand__filter {
    background-color: #fff;
    width: 1000px;
    padding: 20px 30px 30px;
    border-radius: 15px;
    margin: 16px 0;
}

.b-brand .b-products__btn {
    background-color: #fff;
    color: #29adb9;
    max-width: max-content;
    box-shadow: 0 10px 20px rgba(41, 173, 185, .15);
    font-family: "istok_webbold", Arial, Helvetica, sans-serif;
}

.b-brand .b-products__btn:hover {
    background-color: #29adb9;
    color: #fff;
}

.b-brand .b-gallery .b-gallery__prev,
.b-brand .b-gallery .b-gallery__next {
    background: #fff;
    box-shadow: 0 10px 20px rgba(41, 173, 185, .15);
}

.b-brand .b-gallery__prev:before,
.b-brand .b-gallery__next:before {
    color: #29ADB9;
}

.b-brand .b-gallery .b-gallery__prev:hover,
.b-brand .b-gallery .b-gallery__next:hover {
    background: #fff;
}

.b-brand .b-gallery__dots .slick-dots li button {
    color: #fff;
}

@media screen and (max-width: 767px) {
    .b-brand .b-gallery__dots .slick-dots li button {
        color: #29ADB9
    }
}

.b-brand .b-gallery__dots .slick-dots li.slick-active button {
    color: #0C3B9B;
}

.b-brand .b-gallery__dots .slick-dots li.slick-active button:hover {
    color: #0C3B9B;
}

.b-brand .b-gallery__dots .slick-dots li button:hover {
    color: #0C3B9B;
}

.n-nan-optipro {
    background: url(/new/static/brands/nan/images/bg_blocks.jpg) no-repeat center bottom;
    background-size: cover;
    text-align: center;
}

@media screen and (max-width: 767px) {
    .n-nan-optipro {
        background: url(/new/static/brands/nan/images/bg_blocks.jpg) no-repeat left bottom;
        background-size: 1164px 100%;
    }
}

.n-nan-optipro-wrapper {
    padding: 30px 20px 0;
}

.n-nan-optipro h2 {
    font-family: "istok_webbold", Arial, Helvetica, sans-serif;
    font-size: 30px;
    line-height: 36px;
    color: #0C3B9B;
    max-width: 500px;
    margin: 0 auto 20px;
}

.n-nan-optipro-expert__btn {
    margin-top: 20px;
}

.n-nan-optipro-expert p,
.n-nan-optipro-expert-block {
    color: #575757;
    font-size: 16px;
    line-height: 23px;
    margin: 0 auto;
    max-width: 900px;
}

.n-nan-optipro-expert-block {
    margin-top: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 28px;
}

@media screen and (max-width: 767px) {
    .n-nan-optipro-expert-block {
        flex-direction: column;
    }

    .n-nan-optipro-expert-block:nth-child(1) {
        padding-bottom: 0;
    }

    .n-nan-optipro-expert-block:nth-child(1) ul {
        margin-bottom: 20px;
    }
}

.n-nan-optipro-expert-block__first {
    border-bottom: 1px solid #B99847;
}

@media screen and (max-width: 767px) {
    .n-nan-optipro-expert-block img {
        /* margin-top: 15px; */
        margin-bottom: 15px;
    }
}

.n-nan-optipro-expert ul {
    display: inline-block;
    text-align: left;
    vertical-align: top;
    margin-left: 65px;
    max-width: 470px;
}

.n-nan-optipro-expert ul li {
    font-size: 16px;
    line-height: 23px;
    margin-bottom: 10px;
    position: relative;
}

.n-nan-optipro-expert ul li:last-child {
    margin-bottom: 0;
}

.n-nan-optipro-expert ul li:before {
    content: '';
    top: -2px;
    left: -32px;
    position: absolute;
    background: url(/new/static/brands/nan/images/check.svg) no-repeat center;
    background-size: contain;
    width: 23px;
    height: 20px;
}

.n-nan-optipro-wrapper--2 .n-nan-optipro-expert ul {
    max-width: 310px;
}

.n-nan-optipro-wrapper--2 .n-nan-optipro-expert img:nth-child(2) {
    max-width: 140px;
    margin-right: 10px;
}

.n-nan-optipro-expert__sheme {
    max-width: 100%;
    height: auto;
    margin: 20px 0 18px;
}

@media screen and (max-width: 767px) {
    .n-nan-optipro-expert__sheme {
        display: none;
    }
}

.n-nan-video {
    margin: auto;
    padding: 0 10px;
}

.n-nan-video__wrapper {
    background: #cdf0f3;
    padding: 24px 0 30px;
}

.player_vid_iframe {
    max-width: 660px;
    width: 100%;
    border-radius: 20px;
    aspect-ratio: 16/9;
    display: block;
    margin: auto;
    overflow: hidden;
}
.player_vid_iframe iframe{
    width: 100%;
    height: 100%;
}

.n-nan-inside {
    background: url(/new/static/brands/nan/images/bg_fon.png) no-repeat center top;
    background-size: 100% auto;
    background-color: #55BEC4;
    text-align: center;
    padding: 0 20px;
}

@media screen and (max-width: 1023px) {
    .n-nan-inside {
        background-position: top right;
        background-size: auto;
    }
}

.n-nan-inside__title {
    font-size: 30px;
    line-height: 34px;
    font-family: "istok_webbold", Arial, Helvetica, sans-serif;
    margin: 0 auto 20px;
    padding-top: 24px;
    color: #0C3B9B;
}

.n-nan-inside-elem__legend {
    padding-bottom: 20px;
    margin-bottom: 15px;
}

.n_nan_what_in_cons_subtitle {
    font-size: 16px;
    line-height: 20px;
    max-width: 90%;
    width: 900px;
    margin: 0 auto;
    color: #575757;
}

.n-nan-inside-elem__athoms_mob_tabs {
    display: none;
}

@media screen and (max-width: 1023px) {
    .n-nan-inside-elem__athoms_mob_tabs {
        display: block;
    }
}

.n-nan-inside-elem__athoms_mob_tabs_tr {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: calc(100% - 40px);
    margin: 0 auto;
    width: 400px;
    margin-top: 20px;
}

.n-nan-inside-elem__athoms_mob_tabs_tr_title:nth-child(1) {
    margin-top: 10px;
}

.elem__athoms_mob_tabs_tr_title_img {
    margin: 0 auto;
    display: block;
}

.elem__athoms_mob_tabs_tr_title_img2 {
    margin-top: 10px;
}

.elem__athoms_mob_tabs_tr_title_hr {
    display: block;
    margin: 0 auto;
    margin-top: 10px;
    margin-bottom: 8px;
}

.elem__athoms_mob_tabs_tr_title_subtitle {
    font-size: 14px;
    line-height: 16px;
    font-family: "istok_webregular", Arial, Helvetica, sans-serif;
    color: #b99847;
    margin: 0 auto;
}

.n-nan-inside-elem__athoms_mob_tabs_tr_img_img {
    margin: 0 auto;
    width: 140px;
    height: 140px;
}

.n-nan-inside-elem__athoms {
    text-align: center;
    position: relative;
    overflow: visible;
}

@media screen and (max-width: 1023px) {
    .n-nan-inside-elem__athoms {
        display: none;
    }
}

.n-nan-inside-elem__athoms-pack {
    width: 762px;
    height: 570px;
    display: inline-block;
    background: url(/new/static/brands/nan/images/nan-athom-pack_1.png) no-repeat center;
    /* background-size: contain; */
    transform: translateY(-22px);
}

.n-nan-inside-elem__athoms-ath {
    position: absolute;
    left: 50%;
    height: 0;
    width: 0;
    top: 0;
    z-index: 1;
}

.n-nan-inside-elem__athoms-ath-li {
    width: 174px;
    height: 175px;
    background: transparent;
    position: absolute;
    border-radius: 50%;
    top: 200px;
    left: -300px;
    cursor: pointer;
    padding-top: 115px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-animation: nan-fly-lipided 10s linear infinite;
    animation: nan-fly-lipided 10s linear infinite;
}

.n-nan-inside-elem__athoms-ath-be {
    width: 171px;
    height: 175px;
    background: transparent;
    position: absolute;
    left: -210px;
    top: 0px;
    border-radius: 50%;
    cursor: pointer;
    padding-top: 115px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-animation: nan-fly-belokeded 10s linear infinite;
    animation: nan-fly-belokededed 10s linear infinite;
}

.n-nan-inside-elem__athoms-ath-optipro {
    width: 174px;
    height: 175px;
    background: transparent;
    position: absolute;
    top: 200px;
    left: 140px;
    border-radius: 50%;
    cursor: pointer;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    cursor: default;
    -webkit-animation: nan-fly-bifided 10s linear infinite;
    animation: nan-fly-bifided 10s linear infinite;
}

.n-nan-inside-elem__athoms-ath-bifido {
    width: 174px;
    height: 175px;
    background: transparent;
    position: absolute;
    top: 0px;
    left: 50px;
    border-radius: 50%;
    cursor: pointer;
    padding-top: 120px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-animation: nan-fly-bifided 10s linear infinite;
    animation: nan-fly-bifided 10s linear infinite;
}

.n-nan-inside-elem__athoms-ath-bifido img {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
}

.n-nan-inside-elem__athoms-ath-be,
.n-nan-inside-elem__athoms-ath-bifido,
.n-nan-inside-elem__athoms-ath-li,
.n-nan-inside-elem__athoms-ath-optipro,
.n-nan-inside-elem__athoms-piff-i,
.n-nan-inside-elem__athoms-round-i {
    transition: all 2s;
    cursor: default;
}

.n-nan-inside-elem__athoms-piff {
    position: absolute;
    left: 50%;
    margin-left: -55px;
    top: 0;
}

.n-nan-inside-elem__athoms-piff-i {
    width: 120px;
    height: 119px;
    background-size: contain;
    font-size: 0;
    cursor: pointer;
    position: absolute;
}

.n-nan-inside-elem__athoms-piff-i:nth-child(1) {
    left: -400px;
    -webkit-animation: flyAthoms_t 10s linear infinite;
    animation: flyAthoms_t 10s linear infinite;
    -webkit-animation-delay: 1s;
    animation-delay: 1s;
}

.n-nan-inside-elem__athoms-piff-i:before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    height: 100%;
}

.what_in_consi_1_title {
    width: 140px;
    height: 101px;
    position: absolute;
}

.what_in_consi_hr {
    margin: 14px 0 10px 0;
    top: 95px;
    position: absolute;
    left: 90px;
}

.what_in_consi_subtitle {
    top: 114px;
    position: absolute;
    left: 40px;
    width: 180px;
    font-size: 14px;
    line-height: 17px;
    font-family: 'istok_webbold', Arial, Helvetica, sans-serif;
    color: #B99847;
}

.n-nan-inside-elem__athoms-piff-i._revert {
    background-size: cover;
}

.n-nan-inside-elem__athoms-piff-i:nth-child(2) {
    left: -470px;
    top: 220px;
    -webkit-animation: flyAthoms 10s linear infinite;
    animation: flyAthoms 10s linear infinite;
    -webkit-animation-delay: 1s;
    animation-delay: 1s;
}

.n-nan-inside-elem__athoms-piff-i:before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    height: 100%;
}

.what_in_consi_3_title {
    width: 95px;
    height: 55px;
    position: absolute;
}

.what_in_consi_hr_3 {
    margin: 14px 0 10px 0;
    top: 50px;
    position: absolute;
    left: 70px;
}

.what_in_consi_subtitle_3 {
    width: 200px;
    height: 55px;
    position: absolute;
    font-size: 14px;
    line-height: 17px;
    font-family: 'istok_webbold', Arial, Helvetica, sans-serif;
    color: #B99847;
    top: 70px;
    left: 8px;
}

.n-nan-inside-elem__athoms-round {
    position: absolute;
    left: 50%;
    margin-left: -55px;
    top: 0;
}

.n-nan-inside-elem__athoms-round-i {
    width: 100px;
    height: 100px;
    background-size: contain;
    font-size: 0;
    cursor: pointer;
    position: absolute;
}

.n-nan-inside-elem__athoms-round-i:before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    height: 100%;
}

.n-nan-inside-elem__athoms-round-i:nth-child(1) {
    left: 250px;
    top: 0px;
    animation: flyAthoms 10s linear infinite;
    animation-delay: 1s;
}

.what_in_consi_2_1_title {
    width: 136px;
    height: 36px;
    position: absolute;
    left: 58px;
}

.what_in_consi_2_2_title {
    width: 149px;
    height: 19px;
    top: 35px;
    left: 52px;
    position: absolute;
}

.what_in_consi_hr_2 {
    top: 65px;
    position: absolute;
    left: 90px;
}

.what_in_consi_subtitle_2 {
    width: 130px;
    height: 55px;
    position: absolute;
    font-size: 14px;
    line-height: 17px;
    font-family: 'istok_webbold', Arial, Helvetica, sans-serif;
    color: #B99847;
    top: 74px;
    left: 64px;
}

.n-nan-inside-elem__optipro {
    position: absolute;
    left: 50%;
    margin-left: -55px;
    top: 0;
}

.n-nan-inside-elem__optipro-i:nth-child(1) {
    left: 409px;
    top: 230px;
    -webkit-animation: flyAthoms 10s linear infinite;
    animation: flyAthoms 10s linear infinite;
    -webkit-animation-delay: 1s;
    animation-delay: 1s;
}

.what_in_consi_4_title {
    width: 140px;
    height: 48px;
    position: absolute;
}

.what_in_consi_hr_4 {
    top: 60px;
    position: absolute;
    left: 78px;
}

.what_in_consi_subtitle_4 {
    width: 165px;
    position: absolute;
    font-size: 14px;
    line-height: 17px;
    font-family: 'istok_webbold', Arial, Helvetica, sans-serif;
    color: #B99847;
    top: 66px;
    left: 34px;
}

.n-nan-inside-elem__athoms__pUp {
    position: absolute;
    bottom: 100%;
    left: 50%;
    margin-left: -325px;
    width: 650px;
    padding: 40px;
    background: #fff;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
    opacity: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 5px;
    z-index: 2;
}

.n-nan-inside-elem__disclamer {
    position: relative;
    display: flex;
    justify-content: space-between;
    width: 800px;
    max-width: 100%;
    margin: 0 auto;
    margin-top: -193px;
    margin-bottom: 10px;
    padding-right: 64px;
    z-index: 8;
}

@media screen and (max-width: 1023px) {
    .n-nan-inside-elem__disclamer {
        display: none;
    }
}

.n-nan-inside-elem__disclamer_part {
    max-width: 340px;
    font-family: "istok_webbold", Arial, Helvetica, sans-serif;
}

@media screen and (max-width: 1023px) {
    .n-nan-inside-elem__disclamer_part {
        margin: auto;
    }
}

.n-nan-inside-elem__disclamer_part:nth-child(2) {
    max-width: 245px;
}

.n-nan-inside-elem__disclamer__title {
    font-size: 18px;
    line-height: 22px;
    color: #29ADB9;
    text-align: center;
}

.n-nan-inside-elem__disclamer__subtitle {
    font-size: 12px;
    line-height: 17px;
    color: #575757;
    text-align: center;
    margin-top: 16px;
}

.n-nan-inside-elem__disclamer_mob {
    display: none;
}

@media screen and (max-width: 1023px) {
    .n-nan-inside-elem__disclamer_mob {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }
}


.n-nan-shop {
    margin: 28px 0;
}

.n-nan-shop__btns {
    display: flex;
    gap: 22px;
    justify-content: center;
    flex-wrap: wrap;
    position: relative;
    z-index: 1;
}

.n-nan-shop__btn-tg {
    display: inline-block;
    border-radius: 35px;
    position: relative;
    z-index: 1;
    padding: 0 4px;
}

.n-nan-shop__btn-tg a {
    position: relative;
    z-index: 1;
}

.n-nan-shop__btn-tg:hover .n-nan-shop__btn-tg-option {
    box-shadow: 0 0 35px -5px rgba(0, 0, 0, .15);
    height: auto;
    opacity: 1;
    transition: all .3s;
}

.n-nan-shop__btn-tg-option {
    font-size: 16px;
    font-family: "istok_webbold", Arial, Helvetica, sans-serif;
    opacity: 0;
    height: 0;
    overflow: hidden;
    background-color: #fff;
    position: absolute;
    top: 0;
    border-radius: 25px;
    margin-top: -4px;
    padding: 0 4px 4px;
    left: 0;
    width: 100%;
}

.n-nan-shop__btn-tg-option-i:hover a {
    color: #fff;
    background: #29adb9;
}

.n-nan-shop__btn-tg-option a {
    display: inline-block;
    border-bottom: 1px solid transparent;
    text-decoration: none;
    color: #29adb9;
    width: 100%;
    border-radius: 50px;
    padding: 10px 0;
}

.n-button.n-button__fake {
    background: #fff;
    margin-bottom: 4px;
}

.n-button {
    background: #29adb9;
    color: #fff;
    border-radius: 50px;
    padding: 10px 30px;
    font-family: "istok_webbold", Arial, Helvetica, sans-serif;
    font-size: 16px;
    line-height: 24px;
    transition: all .3s;
    display: inline-block;
    box-shadow: 0 10px 20px rgba(41, 173, 185, .15);
}

.n-button:hover {
    background: #fff;
    color: #29adb9;
    box-shadow: 0 0 35px -5px rgba(0, 0, 0, .15);
    transition: all .3s;
}

@media screen and (max-width: 767px) {
    .n-button {
        padding-left: 16px;
        padding-right: 16px;
    }
}

.n-button.n-button__white {
    background: #fff;
    color: #29adb9;
}

.n-button.n-button__white:hover {
    background: #29adb9;
    color: #fff;
}

.n-button--pack {
	width: 140px;
	height: 40px;
	font-size: 12px;
	line-height: 15px;
}

.n-nan-top-banner__button-box .n-button--supreme {
	display: flex;
	justify-content: center;
	align-items: center;
	background: #c49337;
	line-height: 40px;
	padding: 0;
}
.n-nan-top-banner__button-box .n-button--supreme:hover {
	background: #fff;
	color: #29adb9;
}

@media screen and (max-width: 1023px) {
	.n-button--pack {
		width: 114px;
	}
	.n-button--pack br {
		display: none;
	}
	.n-nan-top-banner__button-box .n-button--supreme {
		padding: 5px 14px;
		font-size: 12px;
		line-height: 14px;
	}
}

@media screen and (max-width: 480px) {
	.n-nan-top-banner__button-box .n-button--supreme {
		padding: 5px 22px;
	}
}

@media screen and (max-width: 420px) {
	.n-nan-top-banner__button-box .n-button--pack {
		padding: 5px 12px;
	}
}

@media screen and (max-width: 389px) {
	.n-nan-top-banner__button-box .n-button--pack {
		padding: 7px 8px;
		font-size: 11px;
		line-height: 13px;
	}
}

.n-nan__history {
    font-family: "istok_webbold", Arial, Helvetica, sans-serif;
    background: url(/new/static/brands/nan/images/history-bg.jpg) center right no-repeat;
    background-size: cover;
    max-width: 1000px;
    margin: 26px auto 20px;
    background-color: #fff;
    border-radius: 15px;
    padding: 52px 60px;
    box-sizing: border-box;
    text-align: left;
}

@media screen and (max-width: 767px) {
    .n-nan__history {
        background: url(/images/brands/nan-2021/2021/history-bg-mob.jpg) center bottom no-repeat;
        background-color: #ffffff;
        width: 280px;
        margin: 6px auto 20px;
        padding: 20px 25px 25px;
        text-align: center;
    }
}

.n-nan__history-block {
    max-width: 480px;
    width: 55%;
}

@media screen and (max-width: 767px) {
    .n-nan__history-block {
        width: 100%;
    }
}

.n-nan__history-title {
    font-size: 36px;
    line-height: 100%;
    color: #0c3b9b;
}

@media screen and (max-width: 767px) {
    .n-nan__history-title {
        font-size: 21px;
    }
}

.n-nan__history-text {
    margin-top: 12px;
    margin-bottom: 16px;
    font-size: 21px;
    line-height: 1.15;
    color: #b99847;
}

@media screen and (max-width: 767px) {
    .n-nan__history-text {
        font-size: 16px;
        margin-bottom: 225px;
    }
}

.b-reviews--brand-nan.b-reviews {
    padding: 0 0 26px;
}

.b-reviews--brand-nan .b-reviews__title {
    font-family: "istok_webbold", Arial, Helvetica, sans-serif;
}

.b-reviews--brand-nan .b-reviews__box {
    text-align: left;
}

.b-reviews--brand-nan .b-reviews__buttons {
    margin-top: 26px;
}

.b-reviews--brand-nan .button.button--blue {
    background: #fff;
    color: #29adb9;
    box-shadow: 0 10px 20px rgba(41, 173, 185, .15);
}

.b-reviews--brand-nan .button.button--blue:hover {
    background: #29adb9;
    color: #fff;
}

.b-reviews--brand-nan .button {
    background: #29adb9;
    box-shadow: 0 10px 20px rgba(41, 173, 185, .15);
}

.b-reviews--brand-nan .button:hover {
    background: #fff;
    color: #29adb9;
}

._an-elem .n-nan-inside-elem__athoms-piff-i ._an-elem .n-nan-inside-elem__athoms-round-i,
._not-elem .n-nan-inside-elem__athoms-piff-i,
._not-elem .n-nan-inside-elem__athoms-round-i {
    opacity: 0.5;
}

._not-elem .n-nan-inside-elem__athoms-ath-be,
._not-elem .n-nan-inside-elem__athoms-ath-bifido,
._not-elem .n-nan-inside-elem__athoms-ath-optipro,
._not-elem .n-nan-inside-elem__athoms-ath-li,
._not-elem .n-nan-inside-elem__athoms-piff-i,
._not-elem .n-nan-inside-elem__athoms-round-i {
    left: -80px;
    top: 95px;
    padding-top: 0;
    transform: scale(0.01);
    transition: all 0s;
    animation: none;
}

@media screen and (max-width: 767px) {
    .b-brand .b-product-card {
        box-shadow: 0px 16px 25px -7px rgba(39, 165, 222, 0.5);
        margin-bottom: 16px;
    }
}

@media screen and (max-width: 767px) {
    .b-brand .b-gallery__item {
        margin-bottom: 16px;
    }
}

/* filter */

.brand-filter__wrapper {
    background: #fff;
    border-radius: 15px;
    padding: 10px 16px 10px;
    margin-bottom: 16px;
    position: relative;
}

@media screen and (max-width: 767px) {
    .brand-filter__wrapper {
        box-shadow: 0px 16px 25px -7px rgba(39, 165, 222, 0.5);
    }
}

.brand-filter__header {
    display: flex;
    gap: 10px;
    justify-content: space-between;
    align-items: center;
}

@media screen and (max-width: 767px) {
    .brand-filter__header {
        flex-direction: column;
        align-items: normal;
    }
}

.brand-filter__accordion-spoiler-input {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    pointer-events: none;
}

.brand-filter__toggle.is-opened span {
    border: 0;
}

.brand-filter__toggle.is-opened::after {
    transform: translate(0, -50%) rotate(45deg);
}

.brand-filter__content-box {
    max-height: 0;
    opacity: 0;
}


.brand-filter__content-box.visible-content {
    max-height: 2000px;
    opacity: 1;
    margin-top: 10px;
    transition: opacity 0.25s ease;
}

@media screen and (max-width: 767px) {
    .brand-filter__content-box.visible-content {
        max-height: 200px;
        overflow-y: scroll;
    }
}

.brand-filter__title {
    font-family: "istok_webbold", Arial, Helvetica, sans-serif;
    font-size: 24px;
    line-height: 37px;
    color: #0c3b9b;
}

@media screen and (max-width: 767px) {
    .brand-filter__title {
        font-size: 21px;
        line-height: 26px;
    }
}

.brand-filter__toggle {
    font-family: "istok_webbold", Arial, Helvetica, sans-serif;
    font-size: 14px;
    line-height: 18px;
    transition: all 0.25s;
    color: #29ADB9;
    margin-right: 58px;
    position: relative;
    padding: 11px 0 8px;
    cursor: pointer;
    display: inline-block;
    min-width: 140px;
}

.brand-filter__toggle span {
    border-bottom: 1px dashed #29ADB9;
}

.brand-filter__toggle::after {
    content: '';
    position: absolute;
    right: -58px;
    top: 50%;
    transform: translate(0, -50%) rotate(-135deg);
    width: 40px;
    height: 40px;
    border-radius: 50%;
    box-shadow: 0 0 6px #E6E6EF;
    background-image: linear-gradient(0, #fff, #fff), linear-gradient(0, #fff, #fff);
    background-repeat: no-repeat;
    background-position: 45% 55%, 55% 45%;
    background-size: 2px 9px, 9px 2px;
    background-color: #29ADB9;
    transition: all 0.25s ease;
}

.brand-filter__content {
    display: flex;
}

@media screen and (max-width: 1023px) {
    .brand-filter__content {
        flex-direction: column;
    }
}

.brand-filter__group:first-child {
    flex: 0 1 73%;
}

.brand-filter__group:last-child {
    flex: 0 1 27%;
}

.brand-filter__group-title {
    text-align: center;
    font-size: 16px;
    margin-bottom: 16px;
    font-weight: 600;
}

.brand-filter__group-items {
    display: flex;
    flex-wrap: wrap;
}

@media screen and (max-width: 767px) {
    .brand-filter__group-items {
        flex-direction: column;
    }
}

.brand-filter__group:first-child .b-field {
    flex: 0 1 50%;
}

@media screen and (max-width: 1023px) {
    .brand-filter__group .b-field {
        flex: 0 1 50%;
    }
}


@keyframes bannerChange {
    0% {
        background: url(/new/static/brands/nan/images/bg_top.jpg) no-repeat;
        background-size: contain;
    }

    50% {
        background: url(/new/static/brands/nan/images/bg_top_hands_v2.jpg) no-repeat;
        background-size: contain;
    }

    100% {
        background: url(/new/static/brands/nan/images/bg_top.jpg) no-repeat;
        background-size: contain;
    }
}

@keyframes showText {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes hideText {
    0% {
        opacity: 0;
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@-webkit-keyframes floating-5 {
    0% {
        -webkit-transform: translateY(0%);
        transform: translateY(0%);
    }

    50% {
        -webkit-transform: translateY(10%);
        transform: translateY(10%);
    }

    100% {
        -webkit-transform: translateY(0%);
        transform: translateY(0%);
    }
}

@keyframes floating-5 {
    0% {
        -webkit-transform: translateY(0%);
        transform: translateY(0%);
    }

    50% {
        -webkit-transform: translateY(10%);
        transform: translateY(10%);
    }

    100% {
        -webkit-transform: translateY(0%);
        transform: translateY(0%);
    }
}

@-webkit-keyframes floating-4 {
    0% {
        -webkit-transform: translateY(0%);
        transform: translateY(0%);
    }

    50% {
        -webkit-transform: translateY(5%);
        transform: translateY(5%);
    }

    100% {
        -webkit-transform: translateY(0%);
        transform: translateY(0%);
    }
}

@keyframes floating-4 {
    0% {
        -webkit-transform: translateY(0%);
        transform: translateY(0%);
    }

    50% {
        -webkit-transform: translateY(5%);
        transform: translateY(5%);
    }

    100% {
        -webkit-transform: translateY(0%);
        transform: translateY(0%);
    }
}

@-webkit-keyframes floating-3 {
    0% {
        -webkit-transform: translateY(0%);
        transform: translateY(0%);
    }

    50% {
        -webkit-transform: translateY(8%);
        transform: translateY(8%);
    }

    100% {
        -webkit-transform: translateY(0%);
        transform: translateY(0%);
    }
}

@keyframes floating-3 {
    0% {
        -webkit-transform: translateY(0%);
        transform: translateY(0%);
    }

    50% {
        -webkit-transform: translateY(8%);
        transform: translateY(8%);
    }

    100% {
        -webkit-transform: translateY(0%);
        transform: translateY(0%);
    }
}

.float-5 {
    animation-name: floating-5;
    animation-duration: 2.5s;
    animation-iteration-count: infinite;
    max-width: 50%;
}

.float-4 {
    animation-name: floating-4;
    animation-duration: 4s;
    animation-iteration-count: infinite;
    max-width: 50%;
}

.float-3 {
    animation-name: floating-3;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    max-width: 50%;
}

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

    .float-3,
    .float-4,
    .float-5 {
        animation: none;
    }
}

/* The animation code */

@-webkit-keyframes flyAthoms {
    0% {
        -webkit-transform: translate(0px, 0px);
        -ms-transform: translate(0px, 0px);
        transform: translate(0px, 0px);
    }

    20% {
        -webkit-transform: translate(-5px, -2px) scale(1.1);
        -ms-transform: translate(-5px, -2px) scale(1.1);
        transform: translate(-5px, -2px) scale(1.1);
    }

    40% {
        -webkit-transform: translate(5px, 3px);
        -ms-transform: translate(5px, 3px);
        transform: translate(5px, 3px);
        opacity: 0.5;
    }

    60% {
        -webkit-transform: translate(-2px, 5px) scale(1.1);
        -ms-transform: translate(-2px, 5px) scale(1.1);
        transform: translate(-2px, 5px) scale(1.1);
    }

    80% {
        -webkit-transform: translate(-4px, 2px);
        -ms-transform: translate(-4px, 2px);
        transform: translate(-4px, 2px);
        opacity: 0.5;
    }

    100% {
        -webkit-transform: translate(0px, 0px);
        -ms-transform: translate(0px, 0px);
        transform: translate(0px, 0px);
    }
}

@keyframes flyAthoms {
    0% {
        -webkit-transform: translate(0px, 0px);
        -ms-transform: translate(0px, 0px);
        transform: translate(0px, 0px);
    }

    20% {
        -webkit-transform: translate(-5px, -2px) scale(1.1);
        -ms-transform: translate(-5px, -2px) scale(1.1);
        transform: translate(-5px, -2px) scale(1.1);
    }

    40% {
        -webkit-transform: translate(5px, 3px);
        -ms-transform: translate(5px, 3px);
        transform: translate(5px, 3px);
        opacity: 0.5;
    }

    60% {
        -webkit-transform: translate(-2px, 5px) scale(1.1);
        -ms-transform: translate(-2px, 5px) scale(1.1);
        transform: translate(-2px, 5px) scale(1.1);
    }

    80% {
        -webkit-transform: translate(-4px, 2px);
        -ms-transform: translate(-4px, 2px);
        transform: translate(-4px, 2px);
        opacity: 0.5;
    }

    100% {
        -webkit-transform: translate(0px, 0px);
        -ms-transform: translate(0px, 0px);
        transform: translate(0px, 0px);
    }
}

@-webkit-keyframes flyAthoms_t {
    0% {
        transform: translate(0px, 0px);
    }

    20% {
        transform: translate(-5px, -2px) scale(1.1);
    }

    40% {
        -webkit-transform: translate(5px, 3px);
        -ms-transform: translate(5px, 3px);
        transform: translate(5px, 3px);
        opacity: 0.5;
    }

    60% {
        transform: translate(-2px, 5px) scale(1.1);
    }

    80% {
        transform: translate(-4px, 2px);
        opacity: 0.5;
    }

    100% {
        transform: translate(0px, 0px);
    }
}

@-webkit-keyframes nan-fly-lipided {
    0% {
        -webkit-transform: translate(0px, 0px) scale(1) rotate(0deg);
        -ms-transform: translate(0px, 0px) scale(1) rotate(0deg);
        transform: translate(0px, 0px) scale(1) rotate(0deg);
        opacity: 0.9;
    }

    50% {
        -webkit-transform: translate(0px, 0px) scale(1) rotate(0deg);
        -ms-transform: translate(0px, 0px) scale(1) rotate(0deg);
        transform: translate(-2px, 5px) scale(1.1) rotate(5deg);
        opacity: 1;
    }

    100% {
        -webkit-transform: translate(0px, 0px) scale(1) rotate(0deg);
        -ms-transform: translate(0px, 0px) scale(1) rotate(0deg);
        transform: translate(0px, 0px) scale(1) rotate(0deg);
        opacity: 0.9;
    }
}

@keyframes nan-fly-lipided {
    0% {
        -webkit-transform: translate(0px, 0px) scale(1) rotate(0deg);
        -ms-transform: translate(0px, 0px) scale(1) rotate(0deg);
        transform: translate(0px, 0px) scale(1) rotate(0deg);
        opacity: 0.9;
    }

    50% {
        -webkit-transform: translate(-2px, 5px) scale(1.1) rotate(5deg);
        -ms-transform: translate(-2px, 5px) scale(1.1) rotate(5deg);
        transform: translate(-2px, 5px) scale(1.1) rotate(5deg);
        opacity: 1;
    }

    100% {
        -webkit-transform: translate(0px, 0px) scale(1) rotate(0deg);
        -ms-transform: translate(0px, 0px) scale(1) rotate(0deg);
        transform: translate(0px, 0px) scale(1) rotate(0deg);
        opacity: 0.9;
    }
}

@-webkit-keyframes nan-fly-belokededed {
    0% {
        -webkit-transform: translate(0px, 0px) scale(1) rotate(0deg);
        -ms-transform: translate(0px, 0px) scale(1) rotate(0deg);
        transform: translate(0px, 0px) scale(1) rotate(0deg);
        opacity: 0.9;
    }

    33% {
        -webkit-transform: translate(-15px, -12px) scale(1.05) rotate(5deg);
        -ms-transform: translate(-15px, -12px) scale(1.05) rotate(5deg);
        transform: translate(-15px, -12px) scale(1.05) rotate(5deg);
        opacity: 1;
    }

    66% {
        -webkit-transform: translate(5px, -5px) scale(1.05) rotate(5deg);
        -ms-transform: translate(5px, -5px) scale(1.05) rotate(5deg);
        transform: translate(5px, -5px) scale(1.05) rotate(5deg);
    }

    100% {
        -webkit-transform: translate(0px, 0px) scale(1) rotate(0deg);
        -ms-transform: translate(0px, 0px) scale(1) rotate(0deg);
        transform: translate(0px, 0px) scale(1) rotate(0deg);
        opacity: 0.9;
    }
}

@keyframes nan-fly-belokededed {
    0% {
        -webkit-transform: translate(0px, 0px) scale(1) rotate(0deg);
        -ms-transform: translate(0px, 0px) scale(1) rotate(0deg);
        transform: translate(0px, 0px) scale(1) rotate(0deg);
        opacity: 0.9;
    }

    33% {
        -webkit-transform: translate(-15px, -12px) scale(1.05) rotate(5deg);
        -ms-transform: translate(-15px, -12px) scale(1.05) rotate(5deg);
        transform: translate(-15px, -12px) scale(1.05) rotate(5deg);
        opacity: 1;
    }

    66% {
        -webkit-transform: translate(5px, -5px) scale(1.05) rotate(5deg);
        -ms-transform: translate(5px, -5px) scale(1.05) rotate(5deg);
        transform: translate(5px, -5px) scale(1.05) rotate(5deg);
    }

    100% {
        -webkit-transform: translate(0px, 0px) scale(1) rotate(0deg);
        -ms-transform: translate(0px, 0px) scale(1) rotate(0deg);
        transform: translate(0px, 0px) scale(1) rotate(0deg);
        opacity: 0.9;
    }
}

@-webkit-keyframes nan-fly-bifided {
    0% {
        -webkit-transform: translate(0px, 0px) scale(1) rotate(0deg);
        -ms-transform: translate(0px, 0px) scale(1) rotate(0deg);
        transform: translate(0px, 0px) scale(1) rotate(0deg);
        opacity: 0.9;
    }

    50% {
        -webkit-transform: translate(-5px, -2px) scale(1.1) rotate(5deg);
        -ms-transform: translate(-5px, -2px) scale(1.1) rotate(5deg);
        transform: translate(-5px, -2px) scale(1.1) rotate(5deg);
        opacity: 1;
    }

    100% {
        -webkit-transform: translate(0px, 0px) scale(1) rotate(0deg);
        -ms-transform: translate(0px, 0px) scale(1) rotate(0deg);
        transform: translate(0px, 0px) scale(1) rotate(0deg);
        opacity: 0.9;
    }
}

@keyframes nan-fly-bifided {
    0% {
        -webkit-transform: translate(0px, 0px) scale(1) rotate(0deg);
        -ms-transform: translate(0px, 0px) scale(1) rotate(0deg);
        transform: translate(0px, 0px) scale(1) rotate(0deg);
        opacity: 0.9;
    }

    50% {
        -webkit-transform: translate(-5px, -2px) scale(1.1) rotate(5deg);
        -ms-transform: translate(-5px, -2px) scale(1.1) rotate(5deg);
        transform: translate(-5px, -2px) scale(1.1) rotate(5deg);
        opacity: 1;
    }

    100% {
        -webkit-transform: translate(0px, 0px) scale(1) rotate(0deg);
        -ms-transform: translate(0px, 0px) scale(1) rotate(0deg);
        transform: translate(0px, 0px) scale(1) rotate(0deg);
        opacity: 0.9;
    }
}

/*Animation FLY elements END*/