.lh-21 {
    line-height: 21px;
}

.lh-26 {
    line-height: 26px;
}

.lh-30 {
    line-height: 30px;
}

.lh-36 {
    line-height: 36px;
}

.marb10 {
    margin-bottom: 10px;
}

.marb0 {
    margin-bottom: 0 !important;
}

.marl0 {
    margin-left: 0;
}

.marr0 {
    margin-right: 0;
}

.hideBlock {
    opacity: 0;
}

.visibleBlock {
    opacity: 1;
}

.scrollContainer {
    overflow: hidden;
    width: 100vw;
    height: 100vh;
}

#container {
    transition: transform .5s;
}

.dxt-coral--menu {
    display: none;
}

.buttonUp {
    background: #f04155;
    border-radius: 56px;
    box-shadow: 0 50px 50px 0 rgba(0, 0, 0, 0.1);
    box-sizing: border-box;
    height: 56px;
    width: 56px;
    bottom: 28px;
    position: fixed;
    right: 28px;
    z-index: 99999;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.buttonUp i {
    color: #fff;
}

.buttonUp:after {
    content: " ";
    left: -8px;
    right: -8px;
    top: -8px;
    bottom: -8px;
    position: absolute;
    background-color: rgba(240, 65, 85, .32);
    border: 1px solid rgba(240, 65, 85, .64);
    z-index: 496;
    opacity: .0;
    border-radius: 48px;
    transition-duration: .24s;
    transition-property: left, right, top, bottom, opacity;
    transition-timing-function: ease-in-out;
}

.buttonUp:hover:after {
    opacity: .64;
}


.fullPage {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4240px;
    background: url(images/fullpage5.png);
    background-size: contain;
    z-index: 1;
}

.wrapperAbout.opacity {
    position: relative;
    z-index: 2;
    opacity: .4;
}

.mdl-grid.mdl-width-area {
    padding: 0 5.7%;
}

.mdl-grid.mdl-width-area.allwidth {
    max-width: 100%;
    padding: 0;
}

.allwidth .mdl-cell {
    margin: 8px 0;
}

.allwidth .mdl-cell--6-col, .allwidth .mdl-cell--6-col-desktop.mdl-cell--6-col-desktop {
    width: 50%;
}

.wrapperAbout {
    overflow-x: hidden;
}

img {
    vertical-align: top;
}

header {
    display: none;
}

.img img {
    width: 100%;
}

.firstBlockLink {
    display: block;
    height: 100%;
    position: relative;
}

section#sectionAbout-1 .firstBlockLink {
    cursor: context-menu;
}

.white {
    color: #fff;
}

.lineBottom {
    border-bottom: 1px solid;
    padding-bottom: 40px;
}

.sectionNumber .lineBottom {
    padding-bottom: 11px;
    color: #fff;
}

.rightArrow {
    padding-right: 40px;
    position: relative;
}

.lineBottom i {
    position: absolute;
    right: -3px;
    transform-origin: bottom;
    animation-duration: 2s;
    animation-iteration-count: infinite;
}

.hoverArrow:hover .lineBottom i {
    animation-name: bounceRight;
    animation-timing-function: ease;
}

 @keyframes bounceRight {
    0%   { transform: scale(1,1)    translateX(0); }
    10%  { transform: scale(1.1,.9) translateX(0); }
    30%  { transform: scale(.9,1.1) translateX(-5px); }
    50%  { transform: scale(1,1)    translateX(0); }
    57%  { transform: scale(1,1)    translateX(-3px); }
    64%  { transform: scale(1,1)    translateX(0); }
    100% { transform: scale(1,1)    translateX(0); }
}

.stopScroll {
    overflow: hidden !important;
}

section.sectionAbout-2.visibleMenu.fixed {
    position: fixed;
    width: 100%;
    height: 100vh;
    top: 0;
    left: 0;
    z-index: 800;
    overflow: hidden;
    background: #fff;
}

.desktopHidden {
    display: none;
}

.mobileHidden {
    display: block;
}
.logo_black{
    display:none;
}
.companyHeader {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    padding: 30px 40px;
    z-index: 99999;
}

.backButton {
    float: left;
    text-transform: uppercase;
    font-size: 16px;
    letter-spacing: 0.03em;
    padding: 8px 0px;
}

.backButton a {
    color: #fff;
    position: relative;
    padding-left: 37px;
}

.backButton a i {
    position: absolute;
    left: 0;
    top: -3px;
}

.aboutCompanyMenu {
    position: absolute;
    text-align: center;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    height: 56px;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    align-items: center;
    top: 19px;
}

.aboutCompanyMenu ul {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
}

.aboutCompanyMenu ul li {
    margin-right: 20px;
}

.aboutCompanyMenu ul li:last-child {
    margin-right: 0;
}

.aboutCompanyMenu ul li a {
    text-transform: uppercase;
    font-size: 16px;
    letter-spacing: 0.03em;
    padding: 10px 18px;
    display: inline-block;
    height: 100%;
    color: #fff;
    opacity: .7;
    -webkit-transition: opacity .35s;
    -moz-transition: opacity .35s;
    -ms-transition: opacity .35s;
    -o-transition: opacity .35s;
    transition: opacity .35s;
}

.aboutCompanyMenu ul li a.active {
    border: 1px solid;
    opacity: 1;
}

.aboutCompanyMenu ul li a:hover {
    opacity: 1;
}

.menuNum {
    display: none;
}

.companyLogo {
    float: right;
    margin-top: -4px;
}
.menuItemTitle {
    white-space: nowrap;
}
.sectionAbout-1 {
    /*background: url(images/about_bg1.jpg);*/
    background: #26CAD3;
    width: 100%;
    height: 100vh;
    background-size: cover;
}

.sectionAbout-1 video {
    position: absolute;
    left: 0;
    top: 0;
    /*mix-blend-mode: multiply;*/
    width: 100%;
    height: 100%;
}

@media (min-aspect-ratio: 16/9) {
    .sectionAbout-1 video {
        height: 300%;
        top: -100%;
    }
}

@media (max-aspect-ratio: 16/9) {
    .sectionAbout-1 video {
        width: auto;
    }
}


.sectionInfo {
    margin-top: 161px;
    padding-left: 0;
}

.sectionNumber {
    letter-spacing: 0.03em;
    color: #fff;
    margin-bottom: 57px;
    text-transform: uppercase;
    padding-left: 20px;
    letter-spacing: 0.03em;
}

.sectionAbout-1 .sectionNumber span, .sectionAbout-3 .sectionNumber .rightArrow > span, .sectionPrinciples .sectionNumber span, .sectionPrinciples-7 .sectionNumber .rightArrow > span {
    opacity: .7;
}

.sectionTitle {
    margin-bottom: 70px;
}

.sectionTitle span {
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    position: relative;
    z-index: 1;
    font-family: var(--cci-font-title);
    text-transform: uppercase;
    color: #fff;
    font-size: calc( 30px + (96 - 30) * (100vw - 320px) / (1920 - 320));
    padding: 0px 19px;
    line-height: 1;
    background: #36414D;
    letter-spacing: 0.01em;
}

.sectionDescription {
    color: #fff;
    padding-left: 20px;
}

.bottomLine {
    border-bottom: 1px solid #fff;
    position: relative;
    margin-right: 46px;
    height: 25px;
    width: 110%;
    max-width: 600px;
    margin-left: -16px;
    bottom: -13px;
}

.sectionMission .sectionInfo .bottomLine {
    border-bottom: none;
    text-align: center;
    margin: 0 auto;
}

.goNext {
    position: absolute;
    left: 50%;
    transform: translateX(-100%);
    bottom: 60px;
}

.goNext span {
    position: absolute;
    transform-origin: bottom;
    animation-duration: 2s;
    animation-iteration-count: infinite;
}

.sectionMission .goNext span {
    right: 50%;
}

.firstBlockLink:hover span {
    animation-name: bounce;
    animation-timing-function: ease;
}

 @keyframes bounce {
    0%   { transform: scale(1,1)    translateY(0); }
    10%  { transform: scale(1.1,.9) translateY(0); }
    30%  { transform: scale(.9,1.1) translateY(-5px); }
    50%  { transform: scale(1,1)    translateY(0); }
    57%  { transform: scale(1,1)    translateY(-3px); }
    64%  { transform: scale(1,1)    translateY(0); }
    100% { transform: scale(1,1)    translateY(0); }
}


.goNext span i {
    color: #fff;
}

.sectionAbout-2 {
    position: relative;
    height: 100vh;
}

.mapSliderItem {
    width: 100%;
    height: 100vh;
}

.mapSliderItem img {
    width: 100%;
    position: absolute;
}

.mapSliderItem .sectionInfo {
    position: absolute;
    z-index: 999;
    padding-left: 120px;
    bottom: 90px;
}

.direction--rtl .mapSliderItem .sectionInfo{
    padding-right: 120px;
    padding-left: 0;
}

.mapSliderItem .sectionInfo .sectionNumber {
    color: #000;
    margin-bottom: 51px;
}

.sectionAbout-2 .sectionNumber span {
    opacity: .4;
}

.mapSliderItem .sectionInfo .sectionTitle {
    margin-bottom: 67px;
}

.mapSliderItem .sectionInfo .sectionTitle .marl20 {
    margin-left: -20px;
}

.mapSliderItem .sectionInfo .sectionDescription {
    color: #000;
    padding-left: 20px;
    width: 100%;
    max-width: 620px;
}

.mapSlider .flickity-prev-next-button {
    display: none;
}

.wrapProgress {
    position: absolute;
    height: 2px;
    bottom: 5%;
    z-index: 99999;
    width: 100%;
    left: 120px;
    background: #36414D;
    max-width: 580px;
}

.progress-bar {
    background: #F76059;
    height: 2px;
    /* width: 33.3341%; */
    width: 0;
}

.verticalSlider {
    height: 100vh;
    overflow: hidden;
    width: 100%;
    position: relative;
}

.slide {
    cursor: url("https://www.google.com/intl/en_ALL/mapfiles/openhand.cur"), all-scroll;
    cursor: -webkit-grab;
    cursor: -moz-grab;
    cursor: -o-grab;
    cursor: -ms-grab;
    cursor: grab;
}

.slide:active, .slide:focus {
    cursor: url("https://www.google.com/intl/en_ALL/mapfiles/closedhand.cur"), all-scroll;
    cursor: -webkit-grabbing;
    cursor: -moz-grabbing;
    cursor: -o-grabbing;
    cursor: -ms-grabbing;
    cursor: grabbing;
}

.bigText {
    position: absolute;
    transform: translateX(14%);
    margin-top: 155px;
    transition: transform .45s;
}

.slide-2 .bigText {
    transform: translateX(-3%);
}

.slide-3 .bigText {
    transform: translateX(-34%);
}

.slide-4 .bigText {
    transform: translateX(-44%);
}

.slide-5 .bigText {
    transform: translateX(-60%);
}

.river {
    position: absolute;
    left: 80px;
    opacity: 1;
    transition: opacity 0.35s;
}

.slide-2 .river {
    opacity: 0;
}

.sectionAbout-2_5 .sectionInfo {
    margin-top: 39%;
    position: relative;
}

.sectionAbout-2_5 .sectionInfo .middleTitle {
    position: relative;
}

.sectionAbout-2_5 .sectionInfo .middleTitle .first-title {
    width: 100%;
    transition: width .25s;
    overflow: hidden;
    white-space: nowrap;
}

.sectionAbout-2_5 .slide-2 .sectionInfo .middleTitle .first-title {
    width: 0;
    padding: 0;
}

.sectionAbout-2_5 .sectionInfo .middleTitle .first-title span {
    line-height: 115px;
    display: inline-block;
}

.sectionAbout-2_5 .sectionInfo .middleTitle span.quotes {
    background: #F76059;
    position: absolute;
    top: 0;
    height: 100%;
    transform: translateX(0);
    opacity: 0;
    transition: transform .45s, opacity .2s;
}

.sectionAbout-2_5 .slide-2 .sectionInfo .middleTitle span.quotes {
    transform: translateX(-74px);
    opacity: 1;
    transition: transform .45s, opacity .7s;
}

.sectionAbout-2_5 .slide-3 .sectionInfo .middleTitle span.quotes {
    transform: translateX(-100vw);
}

.sectionAbout-2_5 .slide-4 .sectionInfo .middleTitle span.quotes {
    transform: translateX(-74px);
}

.sectionAbout-2_5 .slide-5 .sectionInfo .middleTitle span.quotes {
    opacity: 0;
    transition: transform .45s, opacity .2s;
}

.sectionAbout-2_5 .sectionInfo .sectionDescription {
    color: #36414D;
    margin-top: 70px;
    padding-left: 60px;
}

.quote {
    color: #F76059;
}

.slide-2 .first-decription {
    transform: translateY(0);
    transition: transform .25s;
}

.slide-2 .first-decription {
    transform: translateY(-100vh);
}

.sectionAbout-2_5 .sectionInfo .sectionDescription p:first-child {
    margin-bottom: 10px;
}

.sectionAbout-2_5 .sectionInfo .address {
    color: #26CAD3;
}


/*slide - 2*/
.lapp {
    position: absolute;
    top: 115px;
    transform: translateX(-100vw) scale(0.8);
    opacity: 1;
    transition: transform .45s, opacity .4s, top .45s, bottom .45s;
}

.lapp img {
    width: 35vw;
}

.slide-2 .lapp {
    transform: translateX(17vw) scale(1);
}

.slide-3 .lapp {
    transform: translateX(62vw) scale(.8);
    opacity: .4;
}

.slide-4 .lapp {
    transform: translateX(100vw) scale(.8);
}

.lapp-quote {
    transform: translateY(100vh);
    transition: transform .25s;
    position: absolute;
    top: 0;
    left: 0;
}

.slide-2 .lapp-quote {
    transform: translateY(0);
}

.slide-3 .lapp-quote {
    transform: translateY(-100vh);
}

/*slide - 3*/
.centerText {
    color: #36414D;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, 115%);
    transition: transform .25s;
}

.slide-3 .centerText {
    transform: translate(-50%, -130%);
}

.slide-4 .centerText {
    transform: translate(-50%, -100vh);
}

.erik {
    position: absolute;
    top: 115px;
    transform: translateX(-100vw) scale(1);
    opacity: 0;
    transition: transform .45s, opacity .4s, top .45s, bottom .45s;
}

.erik img {
    width: 35vw;
}

.slide-3 .erik {
    transform: translateX(6vw) scale(.8);
    opacity: .4;
}

.slide-4 .erik {
    transform: translateX(17vw) scale(1);
    opacity: 1;
}

.slide-5 .erik {
    transform: translateX(-100vw) scale(.8);
    opacity: 1;
}

/*slide - 4*/
.erik-quote {
    transform: translateY(100vh);
    transition: transform .25s;
    position: absolute;
    top: 0;
    left: 0;
}

.slide-4 .erik-quote {
    transform: translateY(0);
}

.slide-5 .erik-quote {
    transform: translateY(-100vh);
}

/*slide - 5*/
.coral-mine {
    position: absolute;
    top: 50%;
    transform: translate(24vw, -50%) scale(0);
    transition: transform .45s;
}

.coral-mine img {
    width: 25.5vw;
}

.slide-5 .coral-mine {
    transform: translate(24vw, -50%) scale(1);
}

.sectionAbout-2_5 .sectionInfo .middleTitle .coral-mine {
    width: 0;
    transition: width .25s, transform .2s;
    overflow: hidden;
    white-space: nowrap;
    position: absolute;
    top: 0;
    transform: translateX(-40px);
}

.sectionAbout-2_5 .sectionInfo .middleTitle .coral-mine span {
    line-height: 115px;
    display: inline-block;
}

.sectionAbout-2_5 .slide-5 .sectionInfo .middleTitle .coral-mine {
    width: 100%;
    transform: translateX(-74px);
}

.coral-mine-text {
    transform: translateY(100vh);
    transition: transform .25s;
    font-weight: 500;
    position: absolute;
    top: 0;
    left: 0;
}

.slide-5 .coral-mine-text {
    transform: translateY(110px);
}

.blueColor {
    color: #26CAD3;
}



nav.slider-dotts {
    position: absolute;
    left: 80px;
    top: 50%;
}

.slider-dotts ul li {
    background: #F76059;
    width: 16px;
    height: 16px;
    border-radius: 100%;
    margin: 35px 0;
    position: relative;
    transition: transform .45s, border-radius .45s;
}

.active-cube {
    content: '';
    display: block;
    width: 62px;
    height: 62px;
    background: #F76059;
    left: -22px;
    position: absolute;
    top: -22px;
}

.slider-dotts ul li.active img {
    transform: scale(0.258);
}

nav {
    position: absolute;
    top: 50%;
    transform: translateY(-40%);
    display: none;
}

.nav__dot, .nav__indicator {
    display: block;
    margin: 4em 5em;
    width: 1em;
    height: 1em;
    background: #F76059;
    border-radius: 100px;
}

.nav__indicator {
    position: absolute;
    background: transparent;
    width: auto;
    border-radius: 0;
    width: 62px;
    height: 62px;
    left: -22px;
    right: 0;
}

.nav__indicator:after {
    content: '';
    background: #F76059;
    width: 100%;
    height: 100%;
    display: block;
    z-index: 1;
}

@keyframes slide {
    from {
        transform: scale(1);
        border-radius: 0;
    }
    50% {
        transform: scale(.3);
        border-radius: 100%;
    }
    to {
        transform: scale(1);
        border-radius: 0;
    }
}

nav.active .nav__indicator:after {
    animation: slide .5s ease-in-out;
    animation-timing-function: linear;
}

.previewImg {
    position: absolute;
    opacity: 0;
    transition: opacity .45s;
    z-index: 5;
}

.previewImg[data-pos="0"] {
    width: 42px;
    left: 10px;
    top: 10px;
}

.previewImg[data-pos="1"] {
    left: -9px;
    top: -19px;
    clip: rect(auto, 71px, auto, 9px);
}

.previewImg[data-pos="2"] {
    top: -19px;
    left: 0;
    clip: rect(auto 62px auto auto);
}

.previewImg[data-pos="3"] {
    top: -18px;
}

nav[data-pos="0"] .nav__indicator {
    top: -22px;
    bottom: 0;
}

nav[data-pos="0"] .nav__indicator {
    -webkit-transition: top .5s cubic-bezier(0.51, 0.92, 0.24, 1.15), bottom .5s cubic-bezier(0.51, 0.92, 0.24, 1.15);
    transition: top .5s cubic-bezier(0.51, 0.92, 0.24, 1.15), bottom .5s cubic-bezier(0.51, 0.92, 0.24, 1.15);
}

nav[data-pos="0"] .previewImg[data-pos="0"] {
    opacity: 1;
}

nav[data-pos="1"] .nav__indicator {
    top: 3em;
    bottom: 7em;
}

nav[data-pos="1"] .nav__indicator {
    -webkit-transition: top .5s cubic-bezier(0.51, 0.92, 0.24, 1.15), bottom .5s cubic-bezier(0.51, 0.92, 0.24, 1.15);
    transition: top .5s cubic-bezier(0.51, 0.92, 0.24, 1.15), bottom .5s cubic-bezier(0.51, 0.92, 0.24, 1.15);
}

nav[data-pos="1"] .previewImg[data-pos="1"] {
    opacity: 1;
    left: -9px;
    top: -19px;
    clip: rect(auto, 71px, auto, 9px);
    transition: left .4s, clip .4s;
}

nav[data-pos="2"] .nav__indicator {
    top: 8em;
    bottom: 12em;
}

nav[data-pos="2"] .nav__indicator {
    -webkit-transition: top .7s cubic-bezier(0.51, 0.92, 0.24, 1.15), bottom .7s cubic-bezier(0.51, 0.92, 0.24, 1.15);
    transition: top .7s cubic-bezier(0.51, 0.92, 0.24, 1.15), bottom .7s cubic-bezier(0.51, 0.92, 0.24, 1.15);
}

nav[data-pos="2"] .previewImg[data-pos="1"] {
    left: -20px;
    top: -19px;
    clip: rect(auto, 80px, auto, 20px);
    opacity: 1;
    z-index: 10;
    transition: left .4s, clip .4s;
}

nav[data-pos="2"] .previewImg[data-pos="2"] {
    opacity: 1;
}

nav[data-pos="3"] .nav__indicator {
    top: 13em;
    bottom: 15em;
}

nav[data-pos="3"] .nav__indicator {
    -webkit-transition: top .7s cubic-bezier(0.51, 0.92, 0.24, 1.15), bottom .7s cubic-bezier(0.51, 0.92, 0.24, 1.15);
    transition: top .7s cubic-bezier(0.51, 0.92, 0.24, 1.15), bottom .7s cubic-bezier(0.51, 0.92, 0.24, 1.15);
}

nav[data-pos="3"] .previewImg[data-pos="2"] {
    top: -19px;
    clip: rect(auto 78px auto auto);
    opacity: 1;
    left: -16px;
    transition: left .4s, clip .4s;
}

nav[data-pos="4"] .nav__indicator {
    top: 19em;
    bottom: 21em;
}

.verticalSlider {
    height: 100vh;
    overflow: hidden;
    width: 100%;
    position: relative;
}

.slide {
    cursor: url("https://www.google.com/intl/en_ALL/mapfiles/openhand.cur"), all-scroll;
    cursor: -webkit-grab;
    cursor: -moz-grab;
    cursor: -o-grab;
    cursor: -ms-grab;
    cursor: grab;
}

.slide:active, .slide:focus {
    ursor: url("https://www.google.com/intl/en_ALL/mapfiles/closedhand.cur"), all-scroll;
    cursor: -webkit-grabbing;
    cursor: -moz-grabbing;
    cursor: -o-grabbing;
    cursor: -ms-grabbing;
    cursor: grabbing;
}

.bigText {
    position: absolute;
    transform: translateX(14%);
    margin-top: 155px;
    transition: transform .45s;
}

.slide-2 .bigText {
    transform: translateX(-3%);
}

.slide-3 .bigText {
    transform: translateX(-34%);
}

.slide-4 .bigText {
    transform: translateX(-44%);
}

.slide-5 .bigText {
    transform: translateX(-60%);
}

.river {
    position: absolute;
    left: 80px;
    opacity: 1;
    transition: opacity 0.35s;
}

.slide-2 .river {
    opacity: 0;
}

.sectionAbout-2_5 .sectionInfo {
    margin-top: 39%;
    position: relative;
}

.sectionAbout-2_5 .sectionInfo .middleTitle {
    position: relative;
}

.sectionAbout-2_5 .sectionInfo .middleTitle .first-title {
    width: 100%;
    transition: width .25s;
    overflow: hidden;
    white-space: nowrap;
}

.sectionAbout-2_5 .slide-2 .sectionInfo .middleTitle .first-title {
    width: 0;
    padding: 0;
}

.sectionAbout-2_5 .sectionInfo .middleTitle .first-title span {
    line-height: 115px;
    display: inline-block;
}

.sectionAbout-2_5 .sectionInfo .middleTitle span.quotes {
    background: #F76059;
    position: absolute;
    top: 0;
    height: 100%;
    transform: translateX(0);
    opacity: 0;
    transition: transform .45s, opacity .2s;
}

.sectionAbout-2_5 .slide-2 .sectionInfo .middleTitle span.quotes {
    transform: translateX(-74px);
    opacity: 1;
    transition: transform .45s, opacity .7s;
}

.sectionAbout-2_5 .slide-3 .sectionInfo .middleTitle span.quotes {
    transform: translateX(-100vw);
}

.sectionAbout-2_5 .slide-4 .sectionInfo .middleTitle span.quotes {
    transform: translateX(-74px);
}

.sectionAbout-2_5 .slide-5 .sectionInfo .middleTitle span.quotes {
    opacity: 0;
    transition: transform .45s, opacity .2s;
}

.sectionAbout-2_5 .sectionInfo .sectionDescription {
    color: #36414D;
    margin-top: 70px;
    padding-left: 60px;
}

.quote {
    color: #F76059;
}

.slide-2 .first-decription {
    transform: translateY(0);
    transition: transform .25s;
}

.slide-2 .first-decription {
    transform: translateY(-100vh);
}

.sectionAbout-2_5 .sectionInfo .sectionDescription p:first-child {
    margin-bottom: 10px;
}

.sectionAbout-2_5 .sectionInfo .address {
    color: #26CAD3;
}


/*slide - 2*/
.lapp {
    position: absolute;
    top: 115px;
    transform: translateX(-100vw) scale(0.8);
    opacity: 1;
    transition: transform .45s, opacity .4s, top .45s, bottom .45s;
}

.lapp img {
    width: 35vw;
}

.slide-2 .lapp {
    transform: translateX(17vw) scale(1);
}

.slide-3 .lapp {
    transform: translateX(62vw) scale(.8);
    opacity: .4;
}

.slide-4 .lapp {
    transform: translateX(100vw) scale(.8);
}

.lapp-quote {
    transform: translateY(100vh);
    transition: transform .25s;
    position: absolute;
    top: 0;
    left: 0;
}

.slide-2 .lapp-quote {
    transform: translateY(0);
}

.slide-3 .lapp-quote {
    transform: translateY(-100vh);
}

/*slide - 3*/
.centerText {
    color: #36414D;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, 115%);
    transition: transform .25s;
}

.slide-3 .centerText {
    transform: translate(-50%, -130%);
}

.slide-4 .centerText {
    transform: translate(-50%, -100vh);
}

.erik {
    position: absolute;
    top: 115px;
    transform: translateX(-100vw) scale(1);
    opacity: 0;
    transition: transform .45s, opacity .4s, top .45s, bottom .45s;
}

.erik img {
    width: 35vw;
}

.slide-3 .erik {
    transform: translateX(6vw) scale(.8);
    opacity: .4;
}

.slide-4 .erik {
    transform: translateX(17vw) scale(1);
    opacity: 1;
}

.slide-5 .erik {
    transform: translateX(-100vw) scale(.8);
    opacity: 1;
}

/*slide - 4*/
.erik-quote {
    transform: translateY(100vh);
    transition: transform .25s;
    position: absolute;
    top: 0;
    left: 0;
}

.slide-4 .erik-quote {
    transform: translateY(0);
}

.slide-5 .erik-quote {
    transform: translateY(-100vh);
}

/*slide - 5*/
.coral-mine {
    position: absolute;
    top: 50%;
    transform: translate(24vw, -50%) scale(0);
    transition: transform .45s;
}

.coral-mine img {
    width: 25.5vw;
}

.slide-5 .coral-mine {
    transform: translate(24vw, -50%) scale(1);
}

.sectionAbout-2_5 .sectionInfo .middleTitle .coral-mine {
    width: 0;
    transition: width .25s, transform .2s;
    overflow: hidden;
    white-space: nowrap;
    position: absolute;
    top: 0;
    transform: translateX(-40px);
}

.sectionAbout-2_5 .sectionInfo .middleTitle .coral-mine span {
    line-height: 115px;
    display: inline-block;
}

.sectionAbout-2_5 .slide-5 .sectionInfo .middleTitle .coral-mine {
    width: 100%;
    transform: translateX(-74px);
}

.coral-mine-text {
    transform: translateY(100vh);
    transition: transform .25s;
    font-weight: 500;
    position: absolute;
    top: 0;
    left: 0;
}

.slide-5 .coral-mine-text {
    transform: translateY(110px);
}

.blueColor {
    color: #26CAD3;
}



nav.slider-dotts {
    position: absolute;
    left: 80px;
    top: 50%;
}

.slider-dotts ul li {
    background: #F76059;
    width: 16px;
    height: 16px;
    border-radius: 100%;
    margin: 35px 0;
    position: relative;
    transition: transform .45s, border-radius .45s;
}

.active-cube {
    content: '';
    display: block;
    width: 62px;
    height: 62px;
    background: #F76059;
    left: -22px;
    position: absolute;
    top: -22px;
}

.slider-dotts ul li.active img {
    transform: scale(0.258);
}

nav {
    position: absolute;
    top: 50%;
    transform: translateY(-40%);
}

.nav__dot, .nav__indicator {
    display: block;
    margin: 4em 5em;
    width: 1em;
    height: 1em;
    background: #F76059;
    border-radius: 100px;
}

.nav__indicator {
    position: absolute;
    background: transparent;
    width: auto;
    border-radius: 0;
    width: 62px;
    height: 62px;
    left: -22px;
    right: 0;
}

.nav__indicator:after {
    content: '';
    background: #F76059;
    width: 100%;
    height: 100%;
    display: block;
    z-index: 1;
}

@keyframes slide {
    from {
        transform: scale(1);
        border-radius: 0;
    }
    50% {
        transform: scale(.3);
        border-radius: 100%;
    }
    to {
        transform: scale(1);
        border-radius: 0;
    }
}

nav.active .nav__indicator:after {
    animation: slide .5s ease-in-out;
    animation-timing-function: linear;
}

.previewImg {
    position: absolute;
    opacity: 0;
    transition: opacity .45s;
    z-index: 5;
}

.previewImg[data-pos="0"] {
    width: 42px;
    left: 10px;
    top: 10px;
}

.previewImg[data-pos="1"] {
    left: -9px;
    top: -19px;
    clip: rect(auto, 71px, auto, 9px);
}

.previewImg[data-pos="2"] {
    top: -19px;
    left: 0;
    clip: rect(auto 62px auto auto);
}

.previewImg[data-pos="3"] {
    top: -18px;
}

nav[data-pos="0"] .nav__indicator {
    top: -22px;
    bottom: 0;
}

nav[data-pos="0"] .nav__indicator {
    -webkit-transition: top .5s cubic-bezier(0.51, 0.92, 0.24, 1.15), bottom .5s cubic-bezier(0.51, 0.92, 0.24, 1.15);
    transition: top .5s cubic-bezier(0.51, 0.92, 0.24, 1.15), bottom .5s cubic-bezier(0.51, 0.92, 0.24, 1.15);
}

nav[data-pos="0"] .previewImg[data-pos="0"] {
    opacity: 1;
}

nav[data-pos="1"] .nav__indicator {
    top: 3em;
    bottom: 7em;
}

nav[data-pos="1"] .nav__indicator {
    -webkit-transition: top .5s cubic-bezier(0.51, 0.92, 0.24, 1.15), bottom .5s cubic-bezier(0.51, 0.92, 0.24, 1.15);
    transition: top .5s cubic-bezier(0.51, 0.92, 0.24, 1.15), bottom .5s cubic-bezier(0.51, 0.92, 0.24, 1.15);
}

nav[data-pos="1"] .previewImg[data-pos="1"] {
    opacity: 1;
    left: -9px;
    top: -19px;
    clip: rect(auto, 71px, auto, 9px);
    transition: left .4s, clip .4s;
}

nav[data-pos="2"] .nav__indicator {
    top: 8em;
    bottom: 12em;
}

nav[data-pos="2"] .nav__indicator {
    -webkit-transition: top .7s cubic-bezier(0.51, 0.92, 0.24, 1.15), bottom .7s cubic-bezier(0.51, 0.92, 0.24, 1.15);
    transition: top .7s cubic-bezier(0.51, 0.92, 0.24, 1.15), bottom .7s cubic-bezier(0.51, 0.92, 0.24, 1.15);
}

nav[data-pos="2"] .previewImg[data-pos="1"] {
    left: -20px;
    top: -19px;
    clip: rect(auto, 80px, auto, 20px);
    opacity: 1;
    z-index: 10;
    transition: left .4s, clip .4s;
}

nav[data-pos="2"] .previewImg[data-pos="2"] {
    opacity: 1;
}

nav[data-pos="3"] .nav__indicator {
    top: 13em;
    bottom: 15em;
}

nav[data-pos="3"] .nav__indicator {
    -webkit-transition: top .7s cubic-bezier(0.51, 0.92, 0.24, 1.15), bottom .7s cubic-bezier(0.51, 0.92, 0.24, 1.15);
    transition: top .7s cubic-bezier(0.51, 0.92, 0.24, 1.15), bottom .7s cubic-bezier(0.51, 0.92, 0.24, 1.15);
}

nav[data-pos="3"] .previewImg[data-pos="2"] {
    top: -19px;
    clip: rect(auto 78px auto auto);
    opacity: 1;
    left: -16px;
    transition: left .4s, clip .4s;
}

nav[data-pos="4"] .nav__indicator {
    top: 19em;
    bottom: 21em;
}

nav[data-pos="4"] .nav__indicator {
    -webkit-transition: top .5s cubic-bezier(0.51, 0.92, 0.24, 1.15), bottom .5s cubic-bezier(0.51, 0.92, 0.24, 1.15);
    transition: top .5s cubic-bezier(0.51, 0.92, 0.24, 1.15), bottom .5s cubic-bezier(0.51, 0.92, 0.24, 1.15);
}

nav[data-pos="4"] .previewImg[data-pos="2"] {
    top: -19px;
    clip: rect(auto 78px auto auto);
    opacity: 0;
    left: -16px;
    transition: left .4s, clip .4s;
}

nav[data-pos="4"] .previewImg[data-pos="4"] {
    opacity: 1;
}

.mobileBg, .lastSlideMobile {
    display: none;
}


@media screen and (max-width: 1665px) {
    .bigText {
        margin-top: 80px;
    }

    .river {
        left: -45px;
    }
}

@media screen and (max-width: 1475px) {
    .bigText {
        margin-top: 60px;
        transform: translateX(50vw);
    }

    .river {
        left: -70px;
        top: 77px;
    }

    .sectionAbout-2_5 .sectionInfo .middleTitle .first-title span, .sectionAbout-2_5 .sectionInfo .middleTitle .coral-mine span {
        font-size: 42px;
        line-height: 80px;
    }

    .sectionAbout-2_5 .sectionInfo .sectionDescription {
        margin-top: 35px;
        padding-left: 30px;
    }
}

@media screen and (max-width: 1330px) {
    .bigText {
        transform: translateX(30vw);
        margin-top: 60px;
    }

    .river {
        left: -70px;
        top: 77px;
    }

    .sectionAbout-2_5 .sectionInfo {
        margin-top: 39%;
    }

    .sectionDescription br {
        display: none;
    }
}

@media screen and (max-width: 1425px) and (min-height: 850px) {
    .lapp {
        bottom: 0;
        top: auto;
    }

    .erik {
        transform: translateX(10vw) scale(1);
        top: auto;
        bottom: 0;
    }

    .slide-3 .lapp, .slide-3 .erik {
        top: auto !important;
        bottom: -115px;
    }
}

@media screen and (max-width: 1110px) {
    .slide-3 .lapp, .slide-3 .erik {
        top: 190px;
        transition: transform .45s, opacity .4s, top .45s, bottom .45s;
    }
}

@media screen and (max-width: 1023px) {
    nav {
        display: none;
    }

    .verticalSlider, .slide {
        height: 100vh;
        width: 100%;
        position: relative;
    }

    .river {
        left: -77px;
        top: auto;
        bottom: 0;
    }

    .river img {
        width: 77%;
    }

    .sectionAbout-2_5 .mdl-grid, .sectionInfo .mdl-cell {
        height: 100%;
    }

    .sectionAbout-2_5 .sectionInfo {
        position: absolute;
        right: 0;
        bottom: 0;
        width: 50%;
    }

    .centerText {
        font-size: 16px;
    }

    .slide-5 .coral-mine {
        transform: translate(12vw, -50%) scale(1);
    }

    .coral-mine img {
        width: 35vw;
    }
}

@media screen and (max-width: 768px) and (max-height: 850px){
    .mobileWidthAll {
        width: 100% !important;
    }

    .bigText {
        transform: translateX(50vw);
    }

    .bigText img {
        height: 90px;
    }

    .river {
        top: -65px;
        bottom: auto;
        transform: translateY(0);
        transition: transform .45s;
    }

    .river img {
        width: calc(100% + 80px);
    }

    .slide-2 .river {
        opacity: 1;
        transform: translateY(-100vh);
    }

    .mobileBg {
        display: block;
        position: fixed;
        width: calc(100% - 40px);
        height: 100%;
        background: #36414D;
        left: 0;
        transform: translateY(100vh);
        transition: transform .45s;
    }

    .slide-2 .mobileBg {
        transform: translateY(0);
    }

    .sectionAbout-2_5 .sectionInfo {
        right: auto;
        transform: translateY(0);
        left: -24px;
        bottom: -8px;
        width: calc(100% + 24px);
        padding: 0 20px 96px;
        z-index: 5;
    }

    .sectionAbout-2_5 .sectionInfo .sectionDescription {
        padding-left: 0;
        margin-top: 0;
        color: #fff;
    }

    .sectionAbout-2_5 .sectionInfo .middleTitle {
        position: relative;
        margin-top: -26px;
    }

    .sectionAbout-2_5 .sectionInfo .middleTitle .first-title span, .sectionAbout-2_5 .sectionInfo .middleTitle .coral-mine span {
        font-size: 32px;
        line-height: 42px;
    }

    .sectionAbout-2_5 .slide-2 .sectionInfo .middleTitle span.quotes {
        transform: translateX(0);
        opacity: 1;
        transition: transform .45s, opacity .7s;
        padding: 5px 8px;
    }

    .sectionAbout-2_5 .sectionInfo .sectionDescription.first-decription {
        color: #36414D;
        padding-top: 18px;
        z-index: 50;
        position: relative;
    }

    .lapp {
        bottom: -95px;
        top: auto !important;
        right: 0;
        transform: translateX(100vw) scale(-0.8, 0.8);
    }

    .lapp img {
        width: 100%;
    }

    .slide-2 .lapp {
        transform: translateX(48px) scale(-1, 1);
    }

    .lapp-quote, .erik-quote {
        width: calc(100% - 40px);
        padding: 45px 20px 0 20px !important;
        height: 100%;
    }

    .slide-3 .lapp {
        transform: translateX(calc(-100vw + 100% - 115px)) scale(-0.8, 0.8);
        bottom: -100px;
    }

    .sectionAbout-2_5 .slide-3 .sectionInfo .middleTitle span.quotes {
        transform: translateX(-100vw);
    }

    .centerText {
        color: #fff;
        left: 20px;
        transform: translate(0, 100vh);
        z-index: 5;
        width: 100%;
        max-width: 270px;
    }

    .centerText br {
        display: none;
    }

    .slide-3 .centerText {
        transform: translate(0, -96px);
    }

    .quote {
        font-size: 14px;
    }

    .erik {
        transform: translateX(100vw) scale(.8);
        bottom: 0;
        top: auto !important;
        right: 0;
    }

    .erik img {
        width: 100%;
    }

    .slide-3 .erik {
        transform: translateX(115px) scale(.8);
        opacity: .4;
        bottom: -110px;
    }

    .slide-4 .centerText {
        transform: translate(0, -100vh);
    }

    .sectionAbout-2_5 .slide-4 .sectionInfo .middleTitle span.quotes {
        transform: translateX(0);
    }

    .slide-4 .lapp {
        transform: translateX(-100vw) scale(-0.8, 0.8);
        bottom: -100px;
    }

    .slide-4 .erik {
        transform: translateX(40px) scale(1);
        opacity: 1;
    }

    .slide-5 .mobileBg {
        transform: translateY(100vh);
    }

    .sectionAbout-2_5 .slide-5 .sectionInfo .middleTitle span.quotes {
        transform: translateX(-100vw);
        opacity: 0;
    }

    .sectionAbout-2_5 .slide-5 .sectionInfo .middleTitle .coral-mine {
        transition: width .35s, transform .2s;
        width: 100%;
        transform: translateX(0px);
    }

    .sectionDescription.coral-mine-text {
        display: none !important;
    }

    .slide-5 .erik {
        transform: translateX(100vw) scale(.8);
        opacity: 1;
    }

    .coral-mine {
        display: none;
    }

    .lastSlideMobile {
        display: block;
        position: absolute;
        top: 0;
        z-index: 1;
        background: #fff;
        height: 100%;
        transform: translateY(100vh);
        transition: transform .45s;
    }

    .slide-5 .lastSlideMobile {
        transform: translateY(0);
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
        flex-direction: row;
    }

    .lastSlideMobile img {
        max-width: 600px;
        width: 100%;
        margin: 0 auto;
        display: block;
    }

    .lastSlideMobile-desc-1 {
        padding: 45px 20px 35px;
        background: #fff;
        height: 25%;
        display: flex;
        align-items: center;
    }

    .lastSlideMobile-desc-2 {
        font-weight: bold;
        font-family: var(--cci-font-title);
        text-transform: uppercase;
        font-size: 20px;
        padding: 45px 20px 35px;
        background: #F4F4F4;
        height: 25%;
        width: 100%;
        display: flex;
        align-items: center;
    }

    .sectionTitle.redBg {
        line-height: 36px;
    }
}

@media screen and (max-height: 650px) {
    .sectionAbout-2_5 .sectionInfo {
        margin-top: 30%;
    }
}

/*end new*/

.sectionAbout-3 {
    background: #26cad3 url(images/missionNext.png) no-repeat center / cover;
    height: 520px;
}

.sectionAbout-3 .sectionInfo {
    margin-top: 167px;
    width: 100%;
    text-align: center;
    transform: none;
}

.sectionAbout-3 .sectionInfo .sectionNumber {
    padding-left: 0;
    margin-bottom: 47px;
}

.sectionAbout-3 .sectionTitle span {
    font-size: calc( 56px + (200 - 56) * (100vw - 320px) / (1920 - 320));
    padding: 0;
    background: none;
    letter-spacing: 0.03em;
    opacity: .7;
}

.sectionNumber a {
    color: #ffff;
}

/*** MISSION ***/
.sectionMission {
    background: #26CAD3;
    width: 100%;
    height: 100vh;
    position: relative;
    overflow: hidden;
}

.sectionMission video {
    position: absolute;
    left: 0;
    top: 0;
    mix-blend-mode: multiply;
    width: 100%;
    height: 100%;
}

@media (min-aspect-ratio: 16/9) {
  .sectionMission video {
    height: 300%;
    top: -100%;
  }
}

@media (max-aspect-ratio: 16/9) {
  .sectionMission video {
    width: 300%;
    left: -100%;
  }
}

.sectionMission .sectionInfo {
    padding-top: 159px;
    width: auto;
    margin-top: 0;
}

.sectionInfo.widthAll {
    width: 100%;
}

.sectionMission .sectionNumber {
    padding-left: 0;
    position: relative;
    z-index: 550;
}

.sectionMission .sectionNumber span {
    opacity: .7;
}

.sectionMission .sectionNumber, .sectionMission .sectionTitle {
    text-align: center;
}

.sectionMission .sectionTitle span {
    letter-spacing: .03em;
    font-size: calc( (100vw - 320px)/(1920 - 320) * (320 - 56) + 56px);
    background: #fff;
    -webkit-background-clip: text;
    color: transparent;
    line-height: .88;
}

.sectionMission-2 {
    padding-top: 180px;
}

.sectionMission-2 .textMission {
    padding-top: 27px;
    padding-left: 58px;
}

.smallTitle {
    margin-bottom: 38px;
}

.smallTitle span {
    font-weight: 600;
    font-style: normal;
    font-stretch: normal;
    position: relative;
    z-index: 1;
    font-family: var(--cci-font-title);
    text-transform: uppercase;
    color: #fff;
    font-size: 42px;
    padding: 3px 10px;
    line-height: 1;
    background: #36414D;
    letter-spacing: .5px;
}

.textMission {
    color: #36414D;
    opacity: 0.9;
}

.sectionMission-2 .text {
    padding-left: 0;
    font-weight: 500;
    opacity: .9;
}

.sectionMission-2 .text a {
    text-decoration: underline;
    color: #26CAD3;
}

.leftLine {
    border-left: 2px solid #26CAD3;
    padding-left: 20px;
    display: block;
    margin-top: 25px;
}

.hydration {
    letter-spacing: .03em;
    text-transform: uppercase;
    font-weight: 500;
    padding: 0;
    border-bottom: 2px solid;
    position: relative;
    display: inline-block;
    margin-top: 62px;
    width: 100%;
    max-width: 355px;
}
.hydration .mdi-arrow-left{
    display:none;
}
.direction--rtl .hydration .mdi-arrow-left{
    display: inline;
}
.direction--rtl .hydration .mdi-arrow-right{
    display:none;
}
.hydration a {
    display: block;
    padding: 10px 30px 10px 10px;
}

.hydration i {
    position: absolute;
    right: 0;
    transform-origin: bottom;
    animation-duration: 2s;
    animation-iteration-count: infinite;
}
.direction--rtl .hydration i {
    left:0;
    right:auto;
}
.direction--rtl .hydration a {
    padding: 10px 10px 10px 30px;
}
.hydration:hover i {
    animation-name: bounceRight;
    animation-timing-function: ease;
}

.emptyBlock {
    height: 80px;
    width: 100%;
}

.emptyBlock.height20 {
    height: 26px;
}

.emptyBlock.height50 {
    height: 52px;
}

.emptyBlock.height60 {
    height: 66px;
}

.emptyBlock.height100 {
    height: 107px;
}

.emptyBlock.height130 {
    height: 135px;
}

.emptyBlock.height140 {
    height: 142px;
}

.emptyBlock.height170 {
    height: 176px;
}

.emptyBlock.h133 {
    height: 133px;
}

.wrapText {
    display: table;
    height: 100%;
}

.wrapText > div {
    display: table-cell;
    vertical-align: middle;
}

.sectionMission-2 .textMission.textUppercase {
    padding-top: 0;
    padding-left: 20px;
}

.textUppercase {
    line-height: 49px;
    text-transform: uppercase;
    font-size: 36px;
    font-weight: bold;
    font-family: var(--cci-font-title);
}

.textUppercase p {
    margin-bottom: 4px;
}

.blueText {
    color: #26CAD3;
}

.sectionMission-3 {
    margin-top: 85px;
    position: relative;
    padding-top: 167px;
}

@keyframes scroll {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(-100%, 0)
  }
}

@keyframes scrollBack {
  0% {
    transform: translate(-100%, 0);
  }
  100% {
    transform: translate(0, 0);
  }
}

.hydrateBig, .conceptBig {
    height: 230px;
    width: 110%;
    position: absolute;
    overflow: hidden;
    top: 0;
}

.hydrateBig span, .conceptBig span, .healthConceptHeadFront span, .healthConceptHeadBack span {
    display: inline-block;
    padding-left: 100%;
    animation: scroll 25s infinite ease-in-out;
}

.healthConceptHeadBack span {
    animation: scrollBack 25s infinite ease-in-out;
}

.middleTitle span, .mobilePrincipleNum {
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    position: relative;
    z-index: 1;
    font-family: var(--cci-font-title);
    text-transform: uppercase;
    color: #fff;
    font-size: calc( (100vw - 320px)/(1920 - 320) * (96 - 30) + 30px);
    padding: 5px 20px;
    line-height: 1.15;
    letter-spacing: .01em;
}

.blueBg span {
    background: #26CAD3;
}

.greenBg span {
    background: #91C164;
}

.purpleBg span {
    background: #6D53BB;
}

.redBg span {
    background: #F76059;
}

.sectionMission-3 .textUppercase {
    margin-left: 14px;
    line-height: 45px;
}

.sectionMission-3 .text {
    margin-left: 60px;
    border-bottom: 1px solid;
    padding-bottom: 20px;
}

.sectionMission-4 {
    background: #91c164;
    height: 520px;
    background-position: center;
    position: relative;
    overflow: hidden;
}

.sectionMission-4 .leaf img {
    position: absolute;
    top: -283px;
    left: auto;
    right: 60px;
    z-index: 150;
    max-width: 981px;
}

.sectionMission-4 .leaf img:last-child {
    top: -150px;
    right: 77px;
    left: auto;
    z-index: 100;
    max-width: 938px;
    -webkit-animation: spin 4s linear infinite;
    -moz-animation: spin 4s linear infinite;
    animation: spin 50s linear infinite;
}

.sectionMission-4 .sectionInfo {
    margin-top: 146px;
    transform: none;
    position: relative;
    z-index: 650;
}

.sectionMission-4 .sectionNumber {
    padding-left: 0;
    margin-bottom: 68px;
}

.sectionMission-4 .sectionNumber .rightArrow > span {
    opacity: .7;
}

.sectionMission-4 .sectionTitle span {
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    position: relative;
    z-index: 1;
    font-family: var(--cci-font-title);
    text-transform: uppercase;
    color: #fff;
    font-size: calc( (100vw - 320px)/(1920 - 320) * (96 - 38) + 38px);
    padding: 6px 18px;
    line-height: 1;
    background: #36414D;
}


/*** PRINCIPLES ***/
.sectionPrinciples {
    background: #91C164;
    width: 100%;
    height: 100vh;
    position: relative;
    overflow: hidden;
}

.leaf img {
    position: absolute;
    top: 90px;
    right: 60px;
    z-index: 150;
}

@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }

.leaf img:last-child {
    top: 129px;
    right: 77px;
    z-index: 100;
    -webkit-animation: spin 4s linear infinite;
    -moz-animation: spin 4s linear infinite;
    animation: spin 50s linear infinite;
}

.sectionPrinciples .sectionInfo {
    position: absolute;
    bottom: 119px;
    z-index: 600;
}

.sectionPrinciples .sectionNumber {
    margin-bottom: 56px;
}

.sectionPrinciples .sectionTitle {
    margin-bottom: 61px;
}

.sectionPrinciples .sectionTitle span {
    font-size: calc( (100vw - 320px)/(1920 - 320) * (96 - 16) + 16px);
}

.sectionPrinciples .bottomLine {
    margin-left: -5px;
    bottom: 0px;
}

.sectionPrinciples-2 {
    padding-top: 221px;
    position: relative;
}

.principleNum {
    position: absolute;
    top: -8px;
    right: 0;
    width: 192px;
}

.principleNum.fixPos {
    position: fixed;
    top: 203px;
    left: 194px;
    width: 200px;
    height: 200px;
/*    background: #cdcdcd;*/
}

.principleNum ul {
    position: absolute;
}

.principleNum li {
    font-weight: 500;
    font-size: 22px;
    line-height: 30px;
    letter-spacing: 0.03em;
    padding-left: 15px;
    margin-bottom: 10px;
    -webkit-transition: font-size .3s;
    -moz-transition: font-size .3s;
    -ms-transition: font-size .3s;
    -o-transition: font-size .3s;
    transition: font-size .3s;
    position: relative;
}

.principleNum li.active {
    font-size: 96px;
    line-height: 112px;
    margin-bottom: 0;
    padding-left: 0;
    -webkit-transition: font-size .3s;
    -moz-transition: font-size .3s;
    -ms-transition: font-size .3s;
    -o-transition: font-size .3s;
    transition: font-size .3s;
    opacity: 1 !important;
}

.principleNum li.active:after {
    content: '';
    width: 60px;
    height: 9px;
    background: #36414d;
    display: block;
    position: absolute;
    top: 50%;
    margin-top: -2.5px;
    right: -78px;
}

.principleNum li:last-child {
    opacity: .1;
}

.principleNum li:nth-child(4) {
    opacity: .3;
}

.principleNum li:nth-child(3) {
    opacity: .5;
}

.principleNum li:nth-child(2) {
    opacity: .7;
}

.sectionPrinciples-2 .textMission, .sectionPrinciples-3 .textMission, .sectionPrinciples-4 .textMission, .sectionPrinciples-5 .textMission, .sectionPrinciples-6 .textMission {
    padding-left: 37px;
}

.sectionPrinciples-2 .textMission .middleTitle {
    margin-bottom: 79px;
}

.sectionPrinciples-2 .textMission .text, .sectionPrinciples-3 .textMission .text, .sectionPrinciples-4 .textMission .text, .sectionPrinciples-5 .textMission .text, .sectionPrinciples-6 .textMission .text {
    padding-left: 20px;
}

span.twoSpan {
    margin-left: -27px;
}

.partnersGrid {
    width: auto;
}

.partnerLinksIcon {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    padding-left: 35px;
}

.partnerIcon {
    margin-right: 0;
    width: 33.333%;
    text-align: center;
    max-width: 130px;
    margin-right: 42px;
    margin-top: 5px;
}

.partnerIcon.active {
    margin-top: -11px;
}

.partnerIcon:last-child {
    margin-right: 0;
}

.partnerIcon img {
    opacity: .3;
    width: 100%;
    max-width: 100px;
    -webkit-transition: opacity .45s;
    -moz-transition: opacity .45s;
    -ms-transition: opacity .45s;
    -o-transition: opacity .45s;
    transition: opacity .45s;

}

.partnerIcon.active img {
    width: 100%;
    opacity: 1;
    max-width: 130px;
}

.partnerLinksLine {
    width: 100%;
    border-top: 3px solid green;
    margin-top: 40px;
    position: relative;
    display: none;
}

.partnerLinksLine span {
    width: 15px;
    height: 15px;
    background: #fff;
    display: block;
    position: absolute;
    content: '';
    top: -10px;
    border-left: 3px solid green;
    border-top: 3px solid green;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transition: left .45s;
    -moz-transition: left .45s;
    -ms-transition: left .45s;
    -o-transition: left .45s;
    transition: left .45s;

}

.partnerLinksDesc {
    margin-left: 52px;
    margin-top: -7px;
    min-height: 180px;
}

.partnerLinksDesc:before {
    content: '';
    position: absolute;
    left: 0;
    border-left: 2px solid #91C164;
    display: block;
    height: 100%;
}

.partnerDesc {
    display: none;
    max-width: 480px;
}

.partnerDesc.active {
    display: block;
}

.sectionPrinciples-3 {
    padding-top: 185px;
}

.sectionPrinciples-3 .textMission .middleTitle,
.sectionPrinciples-4 .textMission .middleTitle,
.sectionPrinciples-5 .textMission .middleTitle {
    margin-bottom: 69px;
}

.composition {
    padding: 50px 0 0 42px;
}

.composition img {
    width: 100%;
    max-width: 1021px;
}

.composition .smallTitle {
    position: absolute;
    left: 25px;
    margin-top: -21px;
}

.compositionList {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    flex-wrap: wrap;
    margin-top: 177px;
}

.compositionItem {
    width: 25%;
    text-align: center;
    margin-bottom: 110px;
}

.compositionItem:nth-child(5), .compositionItem:nth-child(6), .compositionItem:nth-child(7), .compositionItem:nth-child(8) {
    margin-bottom: 0;
}

.compositionItemTitle {
    font-weight: 500;
}

.compositionItemIcon {
    margin-bottom: 35px;
    max-height: 86px;
}

.compositionTitleList, .wrapCompositionListBar {
    display: none;

}

.sectionPrinciples-4 {
    padding-top: 164px;
}

.video {
    margin-top: 7px;
}

.video-wrapper video {
	width:100%;
	height:100%;
	background:#fff;
	position:absolute;
	left:0;
	top:0;
	right:0;
	bottom:0;
}

.video-wrapper {
	position:relative;
    padding:41.25% 0 0;
    max-width: 1021px;
    margin-left: 37px;
}

.videoItem {
    width: 53.7%;
    opacity: .3;
    -webkit-transition: opacity .45s;
    -moz-transition: opacity .45s;
    -ms-transition: opacity .45s;
    -o-transition: opacity .45s;
    transition: opacity .45s;
}

.videoItem.is-selected {
    opacity: 1;
    cursor: pointer;
}

.videoItem.is-selected:before {
    content: '';
    background: url(images/play.svg) no-repeat center;
    width: 85px;
    height: 80px;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 100;
}

.videoItem.is-selected.openVideo:before {
    display: none;
}

.videoItemPreview {
    z-index: 50;
    position: relative;
}

@keyframes hidePreview {
  0% {
    opacity: 1;
    z-index: 100;
  }
  99% {
    opacity: 0;
    z-index: 100;
  }
  100% {
    opacity: 0;
    z-index: -1;
  }
}

.videoItem.is-selected.openVideo .videoItemPreview {
    animation: hidePreview 1s forwards;
}

.videoItemPreview img {
    width: 100%;
}

.videoYoutube {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
}

.videoYoutube iframe {
    width: 100%;
    height: 100%;
}

.videoItemTitle {
    position: absolute;
    bottom: -97px;
    left: 25px;
    z-index: 100;
}

.video .flickity-viewport {
    overflow: visible;
}

.video .flickity-button {
    opacity: 0;
    -webkit-transition: opacity .45s;
    -moz-transition: opacity .45s;
    -ms-transition: opacity .45s;
    -o-transition: opacity .45s;
    transition: opacity .45s;
}

.video:hover .flickity-button {
    opacity: 1;
}

.sectionPrinciples-5 {
    padding-top: 167px;
}

.sectionPrinciples-5 .leftLine {
    border-left: 2px solid #91C164;
}

.vitaminC {
    margin-left: 42px;
}

.vitaminC img {
    width: 100%;
    max-width: 1021px;
}

.sectionPrinciples-6 {
    padding-top: 136px;
}

.sectionPrinciples-6 .textMission .middleTitle {
    margin-bottom: 45px;
}

.sectionPrinciples-6 .mdl-cell:last-child {
    margin-bottom: 0;
}

.mapText {
    width: 100%;
}

.mapText .text {
    padding-left: 62px;
}

.mapText .text.rigthText {
    padding-left: 24px;
    border-left: 2px solid #91C164;

}

.mapImg {
    position: relative;
    margin-top: -90px;
    width: 100%;
}

.sectionPrinciples-7 {
    z-index: 9;
    position: relative;
    background: url(images/conceptNext.png);
    height: 520px;
    background-position: center;
    margin-top: -225px;
}

.sectionPrinciples-7 .sectionInfo {
    margin-top: 160px;
    transform: none;
}

.sectionPrinciples-7 .sectionNumber {
    margin-bottom: 45px;
    padding-left: 8px;
}

.sectionPrinciples-7 .sectionTitle span {
    font-size: calc( 92px + (190 - 92) * (100vw - 320px) / (1920 - 320));
    background: transparent;
    padding: 0;
}

.sectionPrinciples-7.us-lang .sectionInfo {
    margin-top: 105px;
}

.sectionPrinciples-7.us-lang .sectionTitle {
    margin-bottom: 0;
}



/*** HEALTH CONCEPT ***/
.healthConcept {
    background: #6d53bb;
    height: 100vh;
    position: relative;
    overflow: hidden;
}

.healthConcept .sectionInfo .sectionNumber {
    text-align: center;
    z-index: 800;
    position: relative;
    padding-left: 0;
}

.healthConcept .sectionInfo .sectionNumber span, .healthConcept-6 .sectionInfo .sectionNumber .rightArrow > span {
    opacity: .7;
}

.marquee {
    width: 100%;
    overflow: hidden;
}

.js-marquee {
  float: left;
  margin-right: 20px;
}

.wrapper-marquee {
  width: 100000px;
  transform: translateX(0);
  animation: 10s linear 0s infinite normal none running marqueeAnimation;
}

.healthConceptGirl {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: 700;
    height: calc(100% + 5px);
}

.healthConceptGirl img {
    height: 100%;
    width: auto;
}
.direction--rtl .healthConceptHeadFront, .direction--rtl .healthConceptHeadBack{
    direction:ltr;
}
.healthConceptHeadFront {
    transform: rotate(-17.48deg);
    position: absolute;
    top: 50%;
    z-index: 750;
    width: 100%;
    overflow: hidden;
    width: calc(100% + 200px);
    margin-left: -100px;
}

.healthConceptHeadBack {
    transform: rotate(17.48deg);
    position: absolute;
    top: 50%;
    z-index: 650;
    margin-top: -5px;
    overflow: hidden;
    width: calc(100% + 200px);
    margin-left: -100px;
}

.tagline.textUppercase {
    margin-left: 11px;
    letter-spacing: 0.01em;
}

.tagline span {
    display: inline;
}

.healthConcept-2 .textMission {
    margin-left: 7%;
    border-bottom: 1px solid;
    padding-bottom: 40px;
}

.healthConcept-3 {
    padding-bottom: 105px;
    padding-top: 10px;
}

.healthConceptList {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
}

.healthConceptItem {
    width: calc(100vw / 3);
    position: relative;
}

.healthConceptImg img {
    width: 100%;
}

.healthConceptTitle {
    position: absolute;
    left: 30px;
    bottom: -130px;
}

.healthConceptItem .healthConceptTitle .marl20 {
    margin-left: -20px;
}

@media screen and (max-width: 1163px) {
.healthConceptItem .healthConceptTitle .marl20 {
    margin-left: 0;
}
}

.subtitle {
    letter-spacing: .03em;
    text-transform: uppercase;
    font-weight: 500;
    padding: 10px 30px 10px 10px;
    border-bottom: 2px solid;
    position: relative;
    display: inline-block;
    margin-top: 30px;
}

.subtitle i {
    position: absolute;
    right: 0;
    top: 10px;
    transform-origin: bottom;
    animation-duration: 2s;
    animation-iteration-count: infinite;
}

.subtitle:hover i, .hydration:hover i {
    animation-name: bounceRight;
    animation-timing-function: ease;
}

.healthConcept-4 .img img {
    max-width: 917px;
}

.healthConcept-4 .textMission {
    margin-top: 40px;
    width: 101%;
}

.healthConcept-2 .textMission a, .healthConcept-4 .textMission a {
    color: #6D53BB;
    text-decoration: underline;
}

.healthConcept-4 .smallTitle {
    margin-bottom: 41px;
}

.healthConcept-4 .smallTitle span {
    padding: 3px 5px;
}

.healthConcept-5 {
    position: relative;
    padding-top: 141px;
    overflow-x: hidden;
}

.healthConcept-5 .middleTitle span {
    padding: 5px 13px;
}

.img.rectangle {
    padding-left: 78px;
    margin-top: -57px;
}

.img.rectangle img {
    width: auto;
}

.healthConcept-5 .text {
    border-bottom: 1px solid;
    padding-bottom: 25px;
}

.healthConcept-6 {
    background: url(images/community.png);
    height: 520px;
    background-repeat: no-repeat;
    background-size: cover;
}

.healthConcept-6 .sectionInfo {
    margin-top: 90px;
    transform: none;
}

.healthConcept-6 .sectionTitle span {
    background: #F76059;
}

.healthConcept-6 .sectionNumber {
    margin-bottom: 64px;
}

.healthConcept-6 .sectionNumber .lineBottom {
    padding-bottom: 11px;
    padding-right: 88px;
}




/*** COMMUNITY ***/
.sectionCommunity {
    background: url(images/communityBg.png);
    height: 100vh;
    background-repeat: no-repeat;
    background-size: cover;
}

.sectionCommunity .sectionInfo {
    position: relative;
    padding-top: 160px;
    height: 100vh;
    margin-top: 0;
}

.sectionCommunity .sectionTitle span {
    white-space: nowrap;
}

.spanBR span:first-child {
    z-index: 10;
}

.sectionCommunity .sectionInfo .sectionNumber {
    padding-left: 3px;
    color: #fff;
}

.sectionCommunity .sectionNumber span {
    opacity: .7;
}

.sectionCommunity .sectionInfo .bottonPos {
    position: absolute;
    bottom: 55px;
}

.sectionCommunity .sectionInfo .bottonPos .bottomLine {
    bottom: 44px;
    max-width: 423px;
}

.sectionCommunity-2 {
    position: relative;
    padding-top: 294px;
}

.sectionCommunity-2 .text {
    padding-left: 13px;
    max-width: 735px;
}

.communityBig {
    height: 230px;
    width: 100%;
    position: absolute;
    top: 170px;
}

.sectionCommunity-3 {
    overflow-x: hidden;
}

.sectionCommunity-3 .mdl-cell {
    margin-bottom: 0 !important;
}

.tileImg {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    flex-wrap: wrap;
}

.tileImgItem {
    width: 33.3333%;
}

.tileImgItem img {
    width: calc(100% + 1px);
}

.redBackground {
    background: #F76059;
}

.resizeHeight {
    display: table;
    width: 100%;
    padding-left: 8%;
}

.resizeHeight.text, .resizeHeight.textUppercase  {
    padding-right: 8%;
}

.resizeHeight > div {
    display: table-cell;
    vertical-align: middle;
}

.sectionCommunity-3 .lineBottom {
    padding-bottom: 10px;
}

.sectionCommunity-4 {
    height: 520px;
    position: relative;
    margin-top: -2px;
    z-index: 600;
}

.sectionCommunity-4 .mdl-grid.mdl-width-area.allwidth.sectionInfo {
    margin-top: 110px;
    transform: none;
}

.sectionCommunity-4 .sectionInfo .mdl-cell:first-child {
    text-align: right;
    margin: 0;
}

/*.sectionCommunity-4 .sectionInfo .sectionTitle {
    margin-bottom: 0;
    background: url(images/communityLast.png) no-repeat top right;
    background-size: auto;
}

.sectionCommunity-4 .sectionInfo .sectionTitle span {
    font-size: calc( 30px + (96 - 30) * (100vw - 320px) / (1920 - 320));
    padding: 0px 22px;
    background: transparent;
    display: inline-block;
    line-height: 120%;
}

.sectionCommunity-4 .sectionInfo .sectionTitle span:last-child {
    margin-top: -14px;
}*/

.sectionCommunity-4 .sectionInfo .sectionTitle img {
    max-height: 692px;
    width: 100%;
}

.sectionCommunity-4 .sectionInfo .mdl-cell:last-child {
    padding-left: 70px;
}

.sectionCommunity-4 .text {
    padding-top: 15px;
}

.sectionCommunity-4 .text p {
    margin-bottom: 9px;
}

.goToRegistration {
    margin-top: 56px;
}

.goToRegistration a {
    font-weight: 500;
    font-size: 18px;
    line-height: 21px;
    letter-spacing: 0.03em;
    position: relative;
    padding-right: 40px;
}

.goToRegistration a i {
    position: absolute;
    right: 0;
}

.goToRegistration a:hover i {
    animation-name: bounceRight;
    animation-timing-function: ease;
}

.goToRegistration .lineBottom {
    padding-bottom: 15px;
}



@media screen and (min-width: 1900px) {
.sectionTitle span, .middleTitle span, .mobilePrincipleNum {
    font-size: 96px;
}

.sectionAbout-3 .sectionTitle span {
    font-size: 200px;
}

.sectionMission .sectionTitle span {
    font-size: 320px;
}
}



@media screen and (max-width: 1885px) {
.healthConcept-4 .img img {
    width: 96%;
}

/*.healthConcept-4 br {
    display: none;
}*/
}/* 1885 */



@media screen and (max-width: 1830px) {
.healthConcept-2 br {
    display: none;
}

.healthConcept-2 .smallTitle.desktopHidden br {
    display: block;
}
}/* 1830 */



@media screen and (max-width: 1815px) {
.partnerIcon:last-child {
    margin-right: 22px;
}

.partnerIcon.active {
    margin-top: 5px;
}

.partnerIcon.active img {
    max-width: 100px;
}
} /* 1815 */



@media screen and (max-width: 1785px) {
.sectionPrinciples-6 .mapText br {
    display: none;
}
} /*1785*/



@media screen and (max-width: 1680px) {
.sectionCommunity-4 .text {
    padding-top: 0;
}

.sectionCommunity-4 .text br {
    display: none;
}
} /*1680*/



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


.lineBottom.hydration {
    padding: 10px 30px 10px 10px;
    border-bottom: 2px solid;
}
} /*1675*/



@media screen and (max-width: 1620px) {
.leaf img {
    top: 125px;
    right: 0;
    max-width: 705px;
}

.leaf img:last-child {
    top: 140px;
    right: 5px;
    bottom: -87px;
    max-width: 705px;
}

.resizeHeight.text {
    font-size: 18px;
    line-height: 24px;
}

.sectionMission-2 .wrapText .textUppercase p br {
    display: none;
}
} /*1620*/



@media screen and (max-width: 1550px) {
.principleNum {
    top: -19px;
}
} /*1550*/



@media screen and (max-width: 1440px) {
.mapSliderItem .sectionInfo {
    padding-top: 12%;
}

.sectionMission-2 .text br {
    display: none;
}

.mapText .text {
    padding-left: 32px;
}

.sectionMission-4 .leaf img {
    right: -365px;
}

.sectionMission-4 .leaf img:last-child {
    right: -345px;
}
} /*1440*/




@media screen and (max-width: 1410px) {
.textUppercase {
    font-size: 34px;
}
} /*1410*/



@media screen and (max-width: 1330px) {
.textUppercase {
    font-size: 32px;
}

.sectionMission-2 .textMission {
    padding: 5px 0 0;
}

.resizeHeight.text {
    font-size: 16px;
    line-height: 21px;
}
} /*1330*/



@media screen and (max-width: 1280px) {
.leaf img {
    top: 125px;
    right: 0;
    max-width: 560px;
}

.leaf img:last-child {
    top: 140px;
    right: 5px;
    bottom: -87px;
    max-width: 560px;
}

.resizeHeight.text {
    font-size: 14px;
    line-height: 18px;
}

.principleNum {
    top: -27px;
}
} /*1280*/



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

.visible1200 {
    display: block;
}

.textUppercase {
    line-height: 32px;
    font-size: 28px;
}

.partnersGrid .mdl-cell.mdl-cell--6-col-desktop, .sectionPrinciples-3 .mdl-cell.mdl-cell--9-col-desktop {
    width: 100%;
}

.partnerLinksDesc {
    margin-left: 35px;
    margin-top: 15px;
    min-height: 105px;
}

.partnerLinksDesc:before {
    display: none;
}

.sectionPrinciples-6 .mapText > div {
    width: 100%;
}

.mapText .text {
    padding-left: 52px;
}

.mapText .text.rigthText {
    padding-left: 40px;
    margin-left: 52px;
}
} /*1200*/



@media screen and (max-width: 1130px) {
.sectionPrinciples-5 .text br {
    display: none;
}

.companyLogo {
    display: none;
}

.aboutCompanyMenu {
    right: 0;
    left: auto;
    transform: none;
}
} /*1130*/





@media screen and (max-width: 1023px) {
.desktopHidden {
    display: block;
}

.mobileHidden {
    display: none;
}

.mdl-grid.mdl-width-area {
    padding: 0 24px;
}

.sectionTitle span {
    padding: 0 10px !important;
}

.sectionNumber {
    font-size: 16px;
    padding-left: 0;
}

.textMission {
    opacity: 1;
}

.textUppercase {
    line-height: 32px;
    font-size: 28px;
}

.text {
    font-size: 16px;
    line-height: 24px;
    font-weight: 500;
}

.emptyBlock {
    height: 35px;
}

.healthConcept-5 .emptyBlock.height130 {
    height: 70px;
}

.sectionAbout-1 {
    background: #dd7261 url(images/about_bg1.jpg);
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: 155%;
}

.sectionInfo, .sectionMission .sectionInfo {
    margin-top: 50vh;
    transform: translateY(-50%);
    padding-left: 0;
    padding-top: 0;
}

.sectionCommunity .sectionInfo {
    -webkit-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
}

.sectionTitle span {
    padding: 0 10px;
}

.sectionDescription {
    padding-left: 0;
    font-size: 16px;
}

.sectionDescription br {
    display: none;
}

.mapSliderItem .sectionInfo {
    position: relative;
    bottom: 0;
}

.mapSliderItem {
    height: auto;
}

.mapSliderItem img {
    width: 171%;
    position: absolute;
}

.mapSliderItem .sectionInfo {
    padding-left: 20px;
    padding-right: 20px;
}

.mapSliderItem .sectionInfo .sectionTitle .marl20 {
    margin-left: 0;
}

.wrapProgress {
    left: 20px;
}

.sectionAbout-3 .sectionInfo {
    padding-top: 0;
    margin-top: 170px;
    transform: none;
}

.sectionMission-2 {
    padding-top: 0;
    margin-top: -30px;
}

.smallTitle span, .middleTitle span, .mobilePrincipleNum {
    font-size: 38px;
    line-height: 42px;
}

.textMission {
    padding-left: 0 !important;
}

.sectionMission-2 .img img {
    max-width: 100% !important;
}

.cellFullWidth {
    margin: 8px -16px;
    width: calc(100% + 32px) !important;
}

.sectionMission-3 {
    margin-top: -35px;
    position: relative;
    padding-top: 0;
}

.sectionMission-2 .textUppercase, .sectionMission-3 .textUppercase {
    background: #f5f6f6;
    padding: 50px 28px !important;
    margin: 0 -8px;
    font-size: 22px;
    line-height: 32px;
}

.sectionMission-3 .textUppercase p {
    display: inline;
}

.sectionMission-3 .text {
    margin-left: 0;
}

.leaf {
    position: absolute;
    width: 100%;
    height: 100%;
    max-width: 560px;
    max-height: 560px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.sectionMission-4 .leaf {
    position: relative;
    width: 100%;
    height: 100%;
    max-width: initial;
    max-height: initial;
    top: auto;
    left: auto;
    transform: none;
}

.leaf img {
    top: 0;
    right: 0;
    left: 0;
}

.sectionMission-4 .leaf img {
    top: 35px;
    right: -50px;
    max-width: 445px;
}

.leaf img:last-child {
    top: 0;
    right: 0;
    bottom: 0;
}

.sectionMission-4 .leaf img:last-child {
    top: 40px;
    right: -45px;
    max-width: 450px;
}

.sectionPrinciples .sectionInfo.mobile {
    bottom: 55px;
    text-align: left;
    width: 100%;
}

.sectionPrinciples .sectionNumber {
    margin-bottom: 0;
}

.sectionPrinciples-2 {
    padding-top: 0;
}

.sectionPrinciples-2 .sectionInfo {
    margin-top: -30px;
    transform: none;
}

.sectionPrinciples-2 .sectionDescription {
    color: #36414D;
    margin-left: 8px;
    padding-bottom: 20px;
    border-bottom: 1px solid;
    margin-bottom: 65px;
    font-size: 16px;
    font-weight: 500;
}

.principleBlock .textMission .middleTitle {
    padding-right: 58px;
    margin-bottom: 30px;
}

.middleTitle.greenBg .mobilePrincipleNum {
    position: absolute;
    top: -8px;
    right: 0;
    background: transparent;
    color: #000;
}

span.twoSpan {
    margin-left: 0;
}

.sectionPrinciples-2 .textMission .text, .sectionPrinciples-3 .textMission .text, .sectionPrinciples-4 .textMission .text, .sectionPrinciples-5 .textMission .text, .sectionPrinciples-6 .textMission .text {
    padding-left: 0;
}

.sectionPrinciples-2 .textMission .text br, .sectionPrinciples-3 .textMission .text br, .sectionPrinciples-4 .textMission .text br, .sectionPrinciples-5 .textMission .text br, .sectionPrinciples-6 .textMission .text br {
    display: none;
}

.partnersGrid .mdl-cell {
    margin: 8px 0;
}

.partnerLinksIcon {
    padding-left: 0;
}

.partnerIcon

.partnerLinksDesc, .vitaminC {
    margin-left: 0;
}

.partnerDesc {
    font-size: 16px;
    font-weight: 500;
}

.composition {
    padding: 49px 0 0 0;
}

.compositionList {
    margin-top: 115px;
}

.compositionItem:nth-child(7), .compositionItem:nth-child(8) {
    margin-bottom: 0;
}

.sectionPrinciples-3, .sectionPrinciples-4, .sectionPrinciples-5, .sectionPrinciples-6 {
    padding-top: 75px;
}

.sectionPrinciples-5 .textUppercase {
    margin-top: 30px;
}

.mapText .text {
    padding-left: 0;
}

.mapImg {
    margin-top: 0;
}

.sectionPrinciples-7 .sectionInfo {
    margin-top: 90px;
    transform: none;
    text-align: center;
}

.healthConcept .sectionInfo {
    padding-top: 0;
    transform: none;
    margin-top: 173px;
}

.healthConceptGirl {
    position: absolute;
    top: 0;
    transform: translateX(0);
    z-index: 700;
    right: -35%;
}

.healthConceptHeadFront {
    display: none;
}

.healthConceptHeadBack {
    transform: rotate(-90deg);
    position: absolute;
    top: 0;
    z-index: 650;
    margin-top: 0;
    left: -285px;
}

.healthConcept-2 {
    margin-top: -30px;
    z-index: 800;
    position: relative;
}

.tagline {
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    text-transform: none;
    font-family: var(--cci-font-main);
}

.healthConceptList {
    display: block;
}

.healthConceptItem {
    width: 50%;
}

.healthConceptTitle {
    position: relative;
    left: 30px;
    top: -23px;
}

.healthConceptTitle br.desktopHidden {
    display: none;
}

.healthConceptItem .healthConceptTitle .marl20 {
    margin-left: -20px;
}

.healthConcept-2 .mdl-cell--12-col, .healthConcept-2 .mdl-cell--12-col-tablet.mdl-cell--12-col-tablet {
    width: 100% !important;
}

.healthConcept-3 {
    padding-bottom: 0;
}

.healthConcept-4 .mart35, .healthConcept-5 .mart35 {
    margin-top: -35px;
}

.videoItem {
    width: 100%;
}

.healthConcept-5 {
    padding-top: 60px;
}

.healthConcept-6 {
    background: url(images/community.png) no-repeat 10% center / cover;
}

.img.rectangle {
    padding-left: 0;
    margin-top: 0;
}

.img.rectangle img {
    width: 100%;
}

.healthConcept-6 {
    position: relative;
}

.healthConcept-6 .sectionInfo {
    position: absolute;
    bottom: 0;
    min-width: 300px;
}

.mapText .text.rigthText {
    padding-left: 0;
    margin-left: 0;
    border: none;
}

.sectionCommunity .sectionInfo .bottonPos {
    position: relative;
    bottom: auto;
}

.sectionCommunity-2 {
    padding-top: 0;
    margin-top: -35px;
}

.sectionCommunity-3 .textUppercase {
    text-align: center;
}

.allwidth .mdl-cell--12-col, .allwidth .mdl-cell--12-col-tablet.mdl-cell--12-col-tablet {
    width: 100%;
}

.desktopHidden.resizeHeight {
    display: table;
    text-align: center;
    height: 250px !important;
    padding: 0 20px;
}

.desktopHidden.resizeHeight br {
    display: none;
}

.mart0 {
    margin-top: 0 !important;
}

.sectionCommunity-4 .mdl-grid.mdl-width-area.allwidth.sectionInfo {
    transform: none;
    margin-top: -35px;
}

.sectionCommunity-4 {
    height: auto;
    padding-bottom: 30px;
    padding-top: 60px;
}

.sectionCommunity-4 .sectionInfo .mdl-cell:first-child {
    text-align: left;
}

.sectionCommunity-4 .sectionInfo .mdl-cell:last-child {
    padding-left: 0;
}

.sectionCommunity-4 .sectionInfo .mdl-cell:last-child .text > div {
    padding-top: 30px;
    margin-top: 30px;
    border-top: 1px solid;
}

.sectionCommunity-4 .sectionInfo .sectionTitle {
    background: none;
}

.goToRegistration {
    margin-top: 0;
    text-align: center;
    padding: 30px 0;
}

.goToRegistration a {
    color: #36414D;
}

.sectionCommunity {
    background-position-y: 76px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position-x: 16%;
}

.sectionCommunity-2 .text, .sectionCommunity-3 .lineBottom {
    padding-left: 0;
    border-bottom: none;
    max-width: 100%;
}

.sectionCommunity-2 .text br {
    display: none;
}

.sectionCommunity-4 .sectionInfo .sectionTitle span {
    padding: 0 !important;
    line-height: 1.3;
}

.resizeHeight.text {
    font-size: 16px;
    line-height: 24px;
    padding: 30px 5%;
}

.wrapSections {
    padding: 50px 0 100px;
}

.wrapSections.principlesSections {
    padding: 50px 0 0;
}

.wrapSections section {
    /*padding-top: 0;*/
    width: 100%;
    overflow: hidden;
}

.sectionPrinciples-7 {
    margin-top: 0;
}

.partnerLinksDesc {
    margin-left: 15px;
}

.video-wrapper {
    padding: 0;
    margin-left: 0;
    width: 100%;
}

.video-wrapper video {
    position: relative;
}
} /*1023*/



@media screen and (max-width: 875px) {
.backButton a > span {
    display: none;
}

.aboutCompanyMenu ul li {
    margin-right: 10px;
}
} /*875*/



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

.compositionItem {
    width: 20%;
    margin-bottom: 30px;
}

.compositionItemIcon {
    margin-bottom: 0;
    height: 115px;
    max-height: 100%;
    position: relative;
}

.compositionItem .compositionItemIcon img {
    opacity: .5;
    position: absolute;
    bottom: 0;
    left: 50%;
    -webkit-transform: scale(.6) translateX(-50%);
    -moz-transform: scale(.6) translateX(-50%);
    -ms-transform: scale(.6) translateX(-50%);
    -o-transform: scale(.6) translateX(-50%);
    transform: scale(.6) translateX(-50%);
    -webkit-transition: transform .45s;
    -moz-transition: transform .45s;
    -ms-transition: transform .45s;
    -o-transition: transform .45s;
    transition: transform .45s;
    -webkit-transform-origin: left bottom;
    -moz-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    -o-transform-origin: left bottom;
    transform-origin: left bottom;
}

.compositionItem.is-selected .compositionItemIcon img {
    opacity: 1;
    -webkit-transform: scale(1) translateX(-50%);
    -moz-transform: scale(1) translateX(-50%);
    -ms-transform: scale(1) translateX(-50%);
    -o-transform: scale(1) translateX(-50%);
    transform: scale(1) translateX(-50%);

}

.compositionItem:nth-child(5), .compositionItem:nth-child(6) {
    margin-bottom: 30px;
}

.compositionItemTitle {
    display: none;
}

.compositionTitleList, .wrapCompositionListBar {
    display: block;
}

.compositionTitleItem {
    font-family: var(--cci-font-title);
    text-transform: uppercase;
    font-style: normal;
    font-weight: bold;
    font-size: 20px;
    line-height: 26px;
    text-align: center;
    letter-spacing: 0.01em;
    width: 20%;
    opacity: .6;
    -webkit-transition: opacity .45s;
    -moz-transition: opacity .45s;
    -ms-transition: opacity .45s;
    -o-transition: opacity .45s;
    transition: opacity .45s;
}

.compositionTitleItem.is-selected {
    opacity: 1;
}

.compositionTitleList .flickity-prev-next-button {
    top: -30%;
}

.compositionTitleList .flickity-prev-next-button.previous {
    left: -30px;
}

.compositionTitleList .flickity-prev-next-button.next {
    right: -30px;
}

.compositionListBar {
    /* background: #91C164; */
    background: transparent;
    height: 3px;
    width: 14%;
}

.progress-bar.compositionListBar:before {
    content: '';
    display: block;
    position: absolute;
    width: 15px;
    height: 15px;
    border-left: 1px solid #c3c6ca;
    border-top: 1px solid #c3c6ca;
    left: 50%;
    transform: translateX(-50%) rotate(45deg);
    top: -6px;
    background: #fff;
}

.progress-bar.compositionListBar:after {
    content: '';
    display: block;
    position: absolute;
    width: 100%;
    height: 1px;
    background: #c3c6ca;
    top: 1px;
    z-index: -1;
}

.wrapCompositionListBar {
    position: relative;
    width: 90%;
    margin: 15px auto;
}

.healthConcept .sectionInfo {
    margin-top: 135px;
}

.healthConcept .sectionInfo .sectionNumber {
    text-align: right;
}

.healthConceptGirl {
    position: absolute;
    top: 0;
    transform: translateX(0);
    z-index: 700;
    right: 0;
    height: 100%;
    background: url(images/girl.png);
    background-repeat: no-repeat;
    background-size: cover;
    left: 35%;
}

.healthConceptGirl img {
    display: none;
}

.healthConceptHeadBack {
    left: -185px;
    width: calc(100% + 300px);
    top: 40%;
}

.sectionMission-4 .sectionInfo {
    margin-top: 90px;
}

.sectionMission-4 .leaf img {
    top: 125px;
    right: -115px;
}

.sectionMission-4 .leaf img:last-child {
    top: 140px;
    right: -115px;
}

.companyHeader {
    padding: 30px 15px;
}

.menuItemTitle {
    display: none;
}

.menuNum {
    display: inline-block;
}

.aboutCompanyMenu ul li a.active {
    border-bottom: 2px solid;
    border-right: none;
    border-left: none;
    border-top: none;
    opacity: 1;
}

.aboutCompanyMenu ul li a {
    padding: 5px;
    font-weight: 500;
    margin-right: 10px;
}
} /*767*/



@media screen and (max-width: 730px) {
.healthConceptItem {
    width: 100%;
}

.sectionCommunity {
    background-position-x: 24%;
}

.healthConcept-6 {
    background: url(images/community.png) no-repeat 20% center / cover;
}
} /*730*/



@media screen and (max-width: 650px) {
.bottomLine {
    margin-left: 0;
    width: 93%;
}

.goNext span {
    right: -30px;
}

.compositionTitleItem, .compositionItem {
    width: 33.333%;
}
} /*650*/


/*620*/
@media screen and (max-width: 620px) {
    .wrapProgress {
        width: calc(100% - 40px);
    }
}



@media screen and (max-width: 600px) {
.sectionCommunity-2 .text br {
    display: none;
}

.mapSliderItem {
    height: 90vh;
}

.goNext {
    display: none;
}
} /*600*/


@media screen and (max-width: 580px) {
.partnerIcon, .partnerIcon img, .partnerIcon.active img {
    max-width: 100%;
}

.partnerIcon:last-child {
    margin-right: 0;
}

.partnerLinksLine {
    display: block;
}

.partnerLinksDesc {
    margin-left: 0;
    min-height: 180px                               ;
}
}/*580*/



@media screen and (max-width: 560px) {
.mdl-grid.mdl-width-area {
    padding: 0 12px;
}

.middleTitle.blueBg {
    margin-left: 8px;
}

.leaf {
    max-width: 400px;
    max-height: 423px;
}

.leaf img, .leaf img:last-child {
    max-width: 400px;
}

.sectionCommunity-3 .textUppercase {
    font-size: 24px;
}
} /*560*/



@media screen and (max-width: 480px) {
.sectionCommunity-3 .textUppercase {
    font-size: 16px;
    line-height: 23px;
}

.compositionTitleItem, .compositionItem {
    width: 100%;
}
}/*480*/



@media screen and (max-width: 420px) {
.smallTitle span, .middleTitle span, .mobilePrincipleNum {
    font-size: 28px;
    line-height: 31px;
}

.leaf {
    max-width: 300px;
    max-height: 317px;
}

.leaf img, .leaf img:last-child {
    max-width: 300px;
}
} /*420*/



@media screen and (max-height: 680px) {
.sectionAbout-1 .sectionTitle {
    margin-bottom: 45px;
}

.sectionTitle span {
    font-size: calc( 30px + (70 - 30) * (100vw - 320px) / (1920 - 320));
}

.mapSliderItem .sectionInfo {
    padding-top: 7%;
}

.sectionMission .sectionNumber {
    margin-bottom: 25px;
}
}


html[lang="ka"] .wrapperAbout {
    overflow-x: visible;
}

html[lang="ka"] .sectionAbout-1 .sectionTitle span,
html[lang="ka"] .sectionAbout-2 .sectionTitle span,
html[lang="ka"] .sectionMission-4 .sectionTitle span,
html[lang="ka"] .sectionPrinciples .sectionTitle span,
html[lang="ka"] .healthConcept-6 .sectionTitle span,
html[lang="ka"] .sectionCommunity .sectionTitle span {
    line-height: normal;
    padding: 4px 18px;
}

html[lang="ka"] .middleTitle span,
html[lang="ka"] .smallTitle span {
    line-height: 145%;
    padding: 4px 18px;
}
