@font-face {
    font-family: ceraprobold;
    src: url(../../fonts/cera_pro_bold.ttf);
}
@font-face {
    font-family: cerapromedium;
    src: url(../../fonts/cera_pro_medium.ttf);
}
@font-face {
    font-family: ceraprolight;
    src: url(../../fonts/cera_pro_light.ttf);
}

*, html, body {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'ceraprolight', arial, sans-serif;
    color: #0070af;
    scroll-behavior: smooth;
    /* scroll-padding-top: 4rem; */
    /* overflow-x: auto; */
    /* scroll-snap-type: x mandatory; */
}

/* N A V I G A T I O N   M E N U */

.menu-navbar-ncd{
    width: 100%;
    height: 200px;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding: 20px 20px 20px 0px;
    background-image: linear-gradient(to bottom, skyblue, white);
    position: sticky;
    top:-145px;
    z-index: 999;
    /* position: fixed; 
    top: 0;
    z-index: 999; */
    /* background-color: blue; */
}
.container-fluid-nav-ncd{
    width: 100%;
    height: 100%;
    display: flex;
    position: relative;
    /* background-color: green; */
}

/* H  A  M  B  U  R  G  E  R   M  E  N  U */

.hamburger-menu-ncd{
    display: none;
    flex-direction: column;
    height: 25px;
    justify-content: space-around;
    margin: 25px 0;  
    position: relative; 
    margin-right: 20px;
    /* background-color: #000; */
}
.hamburger-menu-ncd input{
    position: absolute;
    width: 28px;
    height: 25px;
    opacity: 0;
    z-index:2;
    cursor: pointer;
}
.hamburger-menu-ncd span{
    display: block;
    width: 28px;
    height: 3px;
    background-color: #0070af;
    border-radius: 3px;
    transition: all 0.5s;
}

/* H  M   M  E  N  U   A  N  I  M  A  T  I  O  N */
.hamburger-menu-ncd span:nth-child(2){
    transform-origin: 0 0; 
}
.hamburger-menu-ncd span:nth-child(4){
    transform-origin: 0 0; 
}
.hamburger-menu-ncd input:checked ~ span:nth-child(2){
    transform: rotate(45deg) translate(0px, -2px);
}
.hamburger-menu-ncd input:checked ~ span:nth-child(4){
    transform: rotate(-45deg) translate(-2px, 0);
}
.hamburger-menu-ncd input:checked ~ span:nth-child(3){
    transform: scale(0);
}


/* L I S T   M E N U   N A V B A R */

.brand-logo-ncd {
    width: 20%;
    height: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    /* background-color:red; */
}
.brand-logo-ncd img {
    width: 140px;
    display: flex;
    /* background-color: #25d366; */
}
.list-menu-navbar-ncd{
    width: 60%;
    height: 100%;
    display: flex;
    /* background-color: brown; */   
}
.list-menu {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    list-style: none;
    gap: 20px;
    /* background-color:white; */
}
.list-menu li {
    width: 110px;
    /* background-color: #25d366;  */
} 
.list-menu li a {
    width: 100%;
    height: 30px;
    font-size: 18px;
    text-decoration: none;
    font-family: 'ceraprobold', arial, sans-serif;
    transition: 0.3s; 
    display: flex;
    justify-content: center;
    align-items: center;
    /* cursor: pointer; */
    /* z-index: 1; */
    /* background-color:yellow; */
 }
.list-menu li a:before {
    content: "";
    position: absolute;
    bottom: -6px;
    width: 5%;
    height: 4px;
    background-color: grey;
    border-radius: 8px 8px 0 0;
    opacity: 0;
    transition: 0.3s;
 }
.list-menu li a:not(.is-active):hover:before{
    opacity: 1;
	bottom: 0;
}
.list-menu li a:not(.is-active):hover{
    color:blue;
}
.nav-indicator {
    position: absolute;
    left: 0;
    bottom: 0;
    transition: 0.4s;
    margin-bottom: 20px;
    height: 5px;
    border-radius: 8px 8px 0 0;
}

/* S E A R C H   N A V   B A R */

.search-box-ncd {
    width: 20%;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    /* background-color: yellow;     */
}
.box-input-ncd {
    width: 70%;
    height: 30px;
    display: flex;
    border-style: solid;
    border-color:#0070af;
    border-radius: 50px;
    /* background-color:moccasin; */
    }
.box-input-ncd input{
    width: 70%;
    text-align: center;
    outline: none;
    font-size: 16px;
    background: transparent;
    border: none;
    font-family: 'cerapromedium', arial, sans-serif;
    /* background-color: #0070af; */
}
.search-icon-ncd {
    width: 25px;
    height: 100%;
    margin-left: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    /* background-color: aliceblue;      */
}
.search-icon-ncd img{
    width: 80%;
    height: 80%;
    top: 100px;
    /* background-color: #000000;    */
}


/* H E A D E R */

.header-img-fullsize-ncd {
  width: 100%;
  height: 100vh;
  background-image: linear-gradient(to bottom, skyblue, white);
  /* background-color: blue;  */
}

.single-row-content-ncd{
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    /* background-color: red; */
}

.wrapper-ncd{
    width: 100%;
    height: 100%;
    display: flex;
    position: absolute;
    /* background-color: yellow; */
    /* overflow: hidden; */
    clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
}
.wrapper-ncd.active{
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    transition: 1s;
    padding: 0;
    /* overflow: hidden; */
}

.wrapper-ncd img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: flex;
    position: absolute;
}

.gradient {
    width: 100%;
    height: 100%;
    position: absolute;
    background: linear-gradient(90deg, rgba(255,255,255,1) 9%, rgba(0,112,175,0.6168592436974789) 100%);
}
.content-text-ncd{
    width: 45%;
    height: 470px;
    padding: 1rem 1rem 1rem 1rem;
    margin-left: 5rem;
    margin-top: 65px;
    position: relative;
    z-index: 1;
    /* box-shadow: 0 5px 15px; */
    /* border-radius: 30px; */
    /* background: linear-gradient(90deg, rgba(255,255,255,0.8) 100%, rgba(0,112,175,0.6168592436974789) 100%); */
    /* background-color: grey; */
}

.content-text-third-slide-ncd{
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items:flex-end;
    position: relative;
    padding-bottom: 54px;
    gap: 10px;
    z-index: 1;
    clip-path: polygon(63% 0, 100% 0%, 100% 100%, 41% 100%);
    background: linear-gradient(240deg, rgba(255,255,255,1) 9%, rgba(0,112,175,0.6168592436974789) 100%);
    /* background-color: violet; */
}

.text-title-style-ncd {
    font-family: 'ceraprobold', arial, sans-serif;
    color: #0070af;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 45px;
    width: 70%;
    line-height: 55px;
    /* background-color: skyblue; */
}

.text-title-style-third-ncd {
    font-family: 'ceraprobold', arial, sans-serif;
    color: #0070af;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 45px;
    width: 45%;
    text-align: right;
    line-height: 55px;
    padding-right: 3%;
    /* margin-left: 720px; */
    /* background-color:darkgoldenrod; */
}
.display-paragraps-ncd{
    width: 80%;
    display: flex;
    padding-bottom: 5px;
    line-height: 20px;
    margin-top: 20px;
    text-align:left;
    font-family: 'cerapromedium', arial, sans-serif;
    font-size: 16px;
    /* background-color: pink; */
    /* overflow: hidden; */
}
.display-paragraps-third-slide-ncd{
    width: 45%;
    display: flex;
    padding-right: 3%;
    padding-bottom: 5px;
    line-height: 20px;
    margin-top: 20px;
    text-align:right;
    font-family: 'cerapromedium', arial, sans-serif;
    font-size: 16px;
    /* background-color: pink; */
    /* overflow: hidden; */
}

.content-text-third-slide-ncd button{
    width: 120px;
    border: none;
    margin-right: 3%;
    color: white;
    padding: 8px 8px;
    background: linear-gradient(0deg, rgba(0,185,255,1) 0%, rgba(0,136,188,1) 45%);
    border-radius: 50px;
    cursor: pointer;
    transition: all 0.3s ease;
}
.content-text-third-slide-ncd button:hover{
    background: grey;
}
/* Sample pertama slider ke dua di header */
.container-background-slide-2-product-special{
    width: 100%; 
    height: 100%; 
    position: absolute; 
    display: flex;
}
.gradient-3 {
    width: 100%;
    height: 100%;
    position: absolute;
    opacity: 0.6;
    background: linear-gradient(90deg, rgba(255,255,255,1) 9%, rgba(0,112,175,0.6168592436974789) 100%);
}

.background-slide-2-product-special{
    width: 50%;
}
.gradient-2 {
    width: 100%;
    height: 100%;
    position: absolute;
    opacity: 0.6;
    background:whitesmoke;
}
.double-row-content-product-special-ncd{
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    position: relative;
    align-items: center;
    justify-content: center;
    /* background-color: blue; */
}
.content-text-profile-product-special-ncd{
    width: 100%;
    margin-top: 50px;
    display: flex;
    position: relative;
    justify-content: center;
    align-items: center;
    /* background-color: yellow;  */
}
.content-text-profile-product-special-ncd p{
    font-size: 45px;
    font-family: 'ceraprobold', arial, sans-serif;
    color: #0070af; 
    /* background-color: aliceblue;    */
}
.content-text-product-spc-ncd {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-around;
    align-items: center;
    /* background-color: orange; */
}
.card-slider-row1-2-ncd{
    width: 40%;
    height: 60%;
    display: flex;
    border-radius: 36px;
    padding: 20px;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;
    background:linear-gradient(270deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.8) 0%);
    /* background-color: #25d366; */
}
.title-name-profile-product-special-ncd{
    width: 50%;
    /* background-color:saddlebrown; */
}
.title-name-profile-product-special-ncd h2{
    font-family: 'cerapromedium', arial, sans-serif;
    text-align: center;
    color: #0070af;;
}
.text-profile-detail-product-special-ncd{
    width: 100%;
    height: 60%;
    display: flex;
    align-items: center;
    /* background-color: white; */
}
.text-profile-detail-product-special-ncd p{
    font-family: 'cerapromedium',arial, sans-serif;
    font-size: 16px;
    text-align: justify;
    letter-spacing: 0.5px;
    color: #0070af;;
    /* background-color: crimson; */
}
.card-slider-row1-2-ncd button{
    width: 30%;
    height: 15%;
    cursor: pointer;
    border-radius: 20px;
    color: white;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    transition-duration:0.3s ;
    -webkit-transition-duration: 0.3s;
    transition-property: box-shadow, transform;
    -webkit-transition-property: box-shadow, transform;   
    background: linear-gradient(0deg, rgba(0,185,255,1) 0%, rgba(0,136,188,1) 45%);
     /* background-color: violet; */
}
.card-slider-row1-2-ncd button:hover{
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    background: grey;
}

/* --------------------------------------------- */


.navigation-button-ncd{
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    opacity: 0;
    transition: opacity 1s ease;   
        /* background-color: #2f3186; */ 
}
.single-row-content-ncd:hover .navigation-button-ncd{
    opacity: 1;
}
.navigation-button-ncd i{
    /* z-index: 999; */
    font-size: 20em;
    display: flex;
    flex-direction: column;
    height:100px;
    justify-content:center;
    position: relative; 
    cursor: pointer;
    /* background-color: red; */
}
.tombol-sebelumnya-ncd span{
    display: block;
    top: 0;
    width: 28px;
    height: 3px;
    border-radius: 3px;
    transition: all 0.5s;
    background-color: #000000;
}
.tombol-sebelumnya-ncd span:nth-child(1){
    transform-origin: 0 0;
    transform: rotate(-30deg) translate(0px, 2px); 
}

.tombol-sebelumnya-ncd span:nth-child(2){
    transform-origin: 0 0;
    transform: rotate(30deg) translate(1px, -3px); 
}

.tombol-selanjutnya-ncd span{
    display: block;
    width: 28px;
    height: 3px;
    background-color: #000000;
    border-radius: 3px;
    transition: all 0.5s;
}
.tombol-selanjutnya-ncd span:nth-child(1){
    transform-origin: 100 100;
    transform: rotate(30deg) translate(-3px, -4px); 
}

.tombol-selanjutnya-ncd span:nth-child(2){
    transform-origin: 100 100;
    transform: rotate(-30deg) translate(-3px, 4px); 
}

/* E  X  P  A  N  D   T  E  X  T   B  O  X */

/* .button-readmore::after{
    content: 'Read More';
    color: white;   
}
.button-readmore{
    width: 35%;
    padding: 5px 10px;
    background: #0070af;
    border-radius: 20px;
    cursor: pointer;
    text-align: center;
}
.button-readmore:hover{
    background: grey;
}
#ch:checked~.button-readmore::after{
    content: 'Read Less';
    color: white;
}
#ch:checked~.display-paragraps-ncd{
    max-height: 100vh;
}
#ch{
    display: none;
} */


/* P  R  O  F  I  L  E   S  E  C  T  I  O  N  */
.header-img-fullsize-2-ncd {
    width: 100%;
    height: 100vh;
    display: flex;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    position: relative;
    /* background-color: blue;  */
    }
.header-img-fullsize-2-ncd::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 54%), linear-gradient(270deg, rgba(255,255,255,1) 0%, rgba(0,112,175,0.46559873949579833) 54%);
}

.double-row-content-ncd{
    width: 100%;
    height: 100%;
    padding: 0px 3rem;
    z-index: 1;
    /* background-color:#25d366; */
}

.wrapper-double-row-ncd{
    width: 100%;
    height: 100%;
    padding: 20px 0;
    display: flex;
    /* justify-content: space-evenly; */
    flex-direction: column;
    /* background-color:green; */
}
.content-text-profile-ncd{
    width: 100%;
    height: 20%;
    padding: 0px 225px;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    /* background-color: yellow;  */
}
.content-text-profile-ncd a {
    width: 210px;
    height: auto;   
    font-size: 35px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center; 
    text-decoration: none;
    font-family: 'ceraprobold';
    z-index: 1;
    transition: 0.3s;
    color: #2f3186; 
    /* background-color: aliceblue;    */
}
.content-text-profile-ncd a:hover{
    color:whitesmoke;
} 
.content-text-profile-ncd a:hover::after{
    opacity: 1;
	bottom: 0;
}
.content-text-profile-ncd a::after {
    content: "";
    position: absolute;
    bottom: -6px;
    width: 75%;
    height: 5px;
    background-color: #2f3186;
    border-radius: 8px 8px 0 0;
    opacity: 0;
    transition: 0.3s;   
}
.content-text-profile2-ncd {
    width: 100%;
    height: 100%;
    padding: 30px 0;
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
	-ms-overflow-style: none; /*Hide scrollbar IE and Edge*/
    /* background-color: orange; */
}
.content-text-profile2-ncd::-webkit-scrollbar{
    display: none;
}
.card-slider-profile-row1-ncd{
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    flex: 1 0 100%;
    scroll-snap-align: start;
    /* background-color: grey; */
}
.card-slider-row1-ncd{
    width: 70%;
    height: 100%;
    display: flex;
    border-radius: 30px;
    padding: 20px;
    position: relative;
    flex-wrap: wrap;
    align-content: flex-start;
    background:linear-gradient(270deg, rgba(255,255,255,0.21349789915966388) 0%, rgba(255,255,255,0.4515931372549019) 100%);
    /* background-color: #25d366; */
}

.wrapper-image-small-cyrcle-ncd{
    width: 15%;
    height: auto;
    /* background-color: brown; */
}

.wrapper-image-small-cyrcle-ncd img{
    width: 100%;
    border-radius: 50%;
    /* background-color: white; */
}

.title-name-profile-ncd{
    width: 85%;
    padding: 20px 30px 0 40px;
    display: flex;
    flex-direction: column;
    /* background-color: chartreuse; */
}
.title-name-profile-ncd h2{
    font-family: 'cerapromedium', arial, sans-serif;
    letter-spacing: 1px;
    color: #2f3186;
}
.title-name-profile-ncd p{
    color: #2f3186;
}
.text-profile-detail-ncd{
    width: 100%;
    padding-top: 10px;
    /* background-color: white; */
}
.text-profile-detail-ncd p{
    font-family: 'cerapromedium', arial, sans-serif;
    font-size: 16px;
    color: #2f3186;
    /* background-color: crimson; */
}
.card-slider-profile-row2-ncd{
    width: 100%;
    display: flex;
    flex: 1 0 100%;
    padding: 0 10%;
    scroll-snap-align: start;
    /* background-color: pink;    */
}
.card-slide-2-content-ncd{
    width: 100%;
    height: 100%;
    border-radius: 30px;
    background: linear-gradient(90deg, rgba(255,255,255,0.3087359943977591) 0%, rgba(255,255,255,0.3087359943977591) 100%); 
    /* background-color: #0070af; */
}
.card-slide-2-content-ncd ul{
    list-style: none;
    line-height: 25px;
    padding: 10px 50px 0 50px;
}
.card-slide-2-content-ncd ul li{
    font-family: 'ceraprobold', arial, sans-serif;
    font-weight: bold;
    font-size: 16px;
    color: #2f3186;
    /* background-color: antiquewhite; */  
}
.card-slide-2-content-ncd ul li::before{
    content:"\2022";
    font-weight: bold;
    display: inline-block;
    width: 20px; 
    margin-left: 0px;
}
.description-text-align-ncd {
    font-family: 'ceraprolight', arial, sans-serif;
    margin-left: 20px;
    font-size: 16px;
    color: #2f3186;
}

/* P  R  O  D  U  C  T   C  A  T  A  L  O  G */

.cover-background-fullsize-ncd {
    width: 100%;
    height: 100vh;
    padding: 10px 0px;
    display: flex;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background: linear-gradient(0deg, rgba(255,255,255,1) 27%, rgba(0,185,255,0.905374649859944) 90%);
    /* background-color: blue; */
}

.slide_content_ncd {
    width: 100%;
    height: 100%;
    padding-top: 30px;
    display: flex;
    /* background-color:darkblue; */
}
.card-text-product-ncd{
    width: 100%;
    height: 100%;
    display: flex;
    padding: 0 31px;
    /* background-color: orange; */
}

.card-slider-product-row1-ncd{
    width: 80%;
    height: 100%;
    display: flex;
    justify-content: center;
    flex-direction: column;
    flex-wrap: wrap;
    gap: 5%;
    flex: 1 0 80%;
    scroll-snap-align: start;
    overflow: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -ms-overflow-style: none; /*Hide scrollbar IE and Edge */
    scrollbar-width: none;
    /* background-color: violet; */
}

.card-slider-product-row1-ncd::-webkit-scrollbar{
    display: none;
}
.card_ncd {
    width: 30%;
    height: 90%;
    display: flex;
    flex-direction: column;
    gap: 5%;
    border-radius: 20px 20px 0 0;
    /* background-color: brown; */
}
.card_image_ncd {
    width: 100%;
    height: 50%;
    border-radius: 20px 20px 0 0;
    /* background: white; */
}
.card_image_ncd img{
    width: 100%;
    height:100%;
    object-fit: cover;
    border-radius: 10px;
}
.card_content_ncd{
    width: 100%;
    height: 50%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    /* background-color: #000; */
}
.title-card-product-ncd {
    width: 100%;
    /* background-color: seagreen */
} 
.title-card-product-ncd h2{
    font-family: 'ceraprobold', Arial, sans-serif;
    font-size: 20px;
    font-weight: bold;
    text-align: left;
}
.text-card-product-ncd {
    width: 100%;
    height: 100%;
    line-height: 17px;
    /* background-color: red; */
} 
.text-card-product-ncd p{
    font-family: 'cerapromedium', arial, sans-serif;
    font-size: 14px; 
    text-align: left;
    /* background-color: chocolate; */
}
.button_readmore_ncd{
    width: 120px;
    border: none;
    font-size: 16px;
    color: white;
    padding: 8px 8px;
    background: linear-gradient(0deg, rgba(0,185,255,1) 0%, rgba(0,136,188,1) 45%);
    border-radius: 50px;
    cursor: pointer;
    transition: all 0.3s ease;
}
.button_readmore_ncd:hover{
    background: grey;
}
.swiper-navBtn-ncd-1 {
    order: -1;
    align-self: center;
    height: 100px;
    width: 50px;
    margin-right: 10px;
    margin-bottom: 100px;
    cursor: pointer;
    /* transform: translateY(-40%); */
}
.swiper-navBtn-ncd-1:before,
.swiper-navBtn-ncd-1:after {
    font-size: 24px;
}
.swiper-navBtn-ncd-2 {
    order: 1;
    align-self: center;
    height: 100px;
    width: 50px;
    margin-left: 10px;
    margin-bottom: 100px;
    /* transform: translateY(-40%); */   
}
.swiper-navBtn-ncd-2:before,
.swiper-navBtn-ncd-2:after {
    font-size: 24px;
}


/* A      R      R      O      W */

button {
    appearance: none;
    background: transparent;
    border: 0;
    outline:0;
  } 
svg {
    padding: 5px;
}
  
.arrow {
    cursor: pointer;
    width: 50px;
    height: 100px;
}
.left {
    left: 0%;
}  
.right {
    right: 0%;
}  
.left:hover polyline,
.left:focus polyline {
    stroke-width: 3;
}
.left:active polyline {
    stroke-width: 6;
    transition: all 100ms ease-in-out;
} 
.right:hover polyline,
.right:focus polyline {
    stroke-width: 3;
}  
.right:active polyline {
    stroke-width: 6;
    transition: all 100ms ease-in-out;
}  
polyline {
    transition: all 250ms ease-in-out;
}

/* A      R      R      O      W */


/* S T R A T E G I C  P A R T N E R */
.cover-background-strategic-partner-ncd{
    width: 100%;
    height: 100vh;
    padding: 0 20px;
    background: linear-gradient(180deg, rgba(255,255,255,1) 27%, rgba(0,185,255,0.905374649859944) 90%);
    /* background-color: #25d366; */
}
.container-sp-ncd{
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    /* background-color: yellow; */
}
.background-image-sp-ncd{
    width: 100%;
    height: 100px;
    display: flex;    
    justify-content: center;
    /* background-color: violet; */
}

.background-image-sp-ncd img{
    width: 90%;
    height: 100%;
    object-fit: cover;
    /* background-color: #000000; */
}
.title-sp-ncd {
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    /* background-color: saddlebrown; */
}

.title-sp-ncd h2{
    width: 50%;
    font-size: 45px;
    text-align: center;
    font-family: 'ceraprobold', arial, sans-serif;   
}
.container-content-card-sp-ncd{
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    /* background-color: crimson; */
}
.card-wow-coffee-ncd{
    width: 30%;
    height: 95%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    /* background-color:#000000; */
}
.card-wow-coffee-ncd a{
    width: 45%;
    text-decoration: none;
}
.card-wow-coffee-ncd img{
    width: 100%; 
    object-fit: cover;
    /* background-color:rgba(0,112,175,0.46559873949579833); */
}
.card-wow-coffee-ncd h3 a{
    color: #1b4949;
    text-decoration: none;
    /* background-color: aliceblue; */
}
.card-wow-coffee-ncd p{
    text-align: left;
    font-family: 'ceraprolight', arial, sans-serif;
    /* background-color:#fff; */
}
/* ------------------------------------------------- */
.card-bisi-ncd{
    width: 30%;
    height: 95%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    /* background-color: rgba(43,172,255,0.9221813725490196); */
}

.card-bisi-ncd a{
    width: 45%;
    text-decoration: none;
}
.card-bisi-ncd img{
    width: 100%;
    object-fit: cover;
    /* background-color:rgba(0,112,175,0.46559873949579833); */
}
.card-bisi-ncd h3 a{
    color: #1b4949;
    text-align: center;
    text-decoration: none;
    /* background-color: aliceblue; */
}
.card-bisi-ncd p{
    text-align: right;
    text-align: center;
    font-family: 'ceraprolight', arial, sans-serif;
    /* background-color: #25d366; */
}
/* ------------------------------------------------- */
.card-semesta-ncd{
    width: 30%;
    height: 95%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items:flex-end;    
    /* background-color: rgba(43,172,255,0.9221813725490196); */
}
.card-semesta-ncd a{
    width: 40%;
    text-decoration: none;
}
.card-semesta-ncd img{
    width: 100%;
    object-fit: cover;
    /* background-color:rgba(0,112,175,0.46559873949579833); */
}
.card-semesta-ncd h3 a{
    color: #1b4949;
    text-align: right;
    text-decoration: none;
    /* background-color: aliceblue; */
}
.card-semesta-ncd p{
    text-align: right;
    font-family: 'ceraprolight', arial, sans-serif;
    /* background-color: #25d366; */
}


/* Q     U     O     T     A     T     I     O     N*/
.cover-background-fullsize-quotation-ncd{
    width: 100%;
    height: 50vh;
    display: flex;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;;
    /* background-color: yellow; */
    /* background: linear-gradient(0deg, rgba(255,255,255,1) 36%, rgba(0,185,255,0.44879201680672265) 90%); */
    /* padding-bottom: 3rem; */
    /* background-color: blue; */
}
.cover-background-fullsize-quotation-ncd::after {
    content: '';
    position: absolute;
    display: flex;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, rgba(255,255,255,0.5048144257703081) 0%, rgba(0,185,255,0.44879201680672265) 90%);
}
.countainer-form-ncd{
    width: 100%;
    height: 100%;
    display: flex;
    z-index: 1;
    position: relative;
    padding: 30px 0px;
    /* background-color: turquoise; */
}
.quotation-container-ncd{
    width: 100%;
    height: 100%;
    display: flex;
    padding: 0 90px 0 60px;
    justify-content: center;
    align-items: center;
    /* background-color: #2f3186;  */
}
.quotation-form-ncd{
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    /* background-color: antiquewhite; */
}

.quotation-form-ncd h2{
    text-align: left;
    font-size: 50px;
    color: white;
    font-weight: 900;
    height: 200px;
    /* background-color:tomato; */
}

.quotation{
    max-width: 70%;
    margin-right: 70px;
    /* margin-top: 20px; */
    height: 100%;
    display: flex;
    flex-wrap:wrap ;
    gap: 20px;
    border-top-color:white ;
    border-top-style:solid;
    /* background-color:chartreuse ; */

}

.subject-box{
    margin-top: 20px;
    border-color: grey;
    border-style: solid;
    height: 50px;
    width: 50%;
    border-radius: 10px;
    font-size: 20px;
    margin-right: 190px;
    padding-left: 10px;
}

.name-box{
    border-color: grey;
    border-style: solid;
    height: 50px;
    width: 32%;
    border-radius: 10px;
    font-size: 20px;
    padding-left: 10px;
    margin-bottom: 20px;
}
.phone-box{
    border-color: grey;
    border-style: solid;
    height: 50px;
    width: 32%;
    border-radius: 10px;
    font-size: 20px;
    padding-left: 10px;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-inner-spin-button{
    -webkit-appearance:none;
    margin: 0;
}

.submit-box{
    border-color: grey;
    border-style: solid;
    height: 50px;
    width: 25%;
    border-radius: 10px;
    font-size: 20px;
    color: white;
    font-weight: 1000;
    cursor: pointer;
    background:linear-gradient(180deg, rgba(0,185,255,1) 0%, rgba(0,136,188,1) 65%);
}



/* N   E   W   S    S   E   C   T   I   O   N */


.cover-background-fullsize-news-ncd{
    width: 100%;
    height: 100vh;
    display: flex;
    justify-content: center;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;;
    /* background-color: yellow; */
    /* background: linear-gradient(225deg, rgba(0,185,255,0) 0%, rgba(0,136,188,1) 100%); */
    /* padding-bottom: 3rem; */
    /* background-color: blue; */
}

.cover-background-fullsize-news-ncd::after {
    content: '';
    position: absolute;
    display: flex;
    width: 100%;
    height: 100%;
    background: linear-gradient(225deg, rgba(255,255,255,0.44879201680672265) 29%, rgba(43,172,255,0.9221813725490196) 100%);
}

.container-ncd{
    width: 100%;
    height: 100%;
    padding: 40px 0;
    z-index: 1;
    /* background-color: brown; */
}

.container-news-ncd {
    width: 100%;
    height: 100%;
    display: flex;
    padding: 0 50px;
    /* background-color: yellow; */
}

.content-news-ncd{
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    /* background-color: violet; */
}

.title-news-section-ncd {
    width: 100%;
    height: 75px;
    /* display: flex; */
    align-items: center;
    /* background-color: slateblue; */
}

.title-news-section-ncd h1 {
    font-size: 57px;
    font-weight: 2000;
    color: #2f3186;
}

.card-container-news-ncd{
    width: 100%;
    height: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: center;
    overflow-x: auto;
    gap: 2rem;
    /* background-color: tomato; */
} 

.card-news-content-ncd{
    width: 500px;
    height: 175px;
    align-items: center;
    display: flex;
    border-radius: 10px;
    background: linear-gradient(225deg, rgba(255,255,255,0.45) 0%, rgba(255,255,255,0.45) 100%);
    /* background-color: #25d366; */
}

/* active color */
.image-card-news-ncd{
    position: relative;
    width: 225px;
    height: 175px;
    padding: 10px;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    /* background: linear-gradient(225deg, rgba(255,255,255,0.45) 0%, rgba(255,255,255,0.45) 100%); */
    /* background-color: yellow; */
}

.image-card-news-ncd .wrap-img-ncd {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
}

/* active color */
.title-news-card-ncd{
    width: 350px;
    height: 100%;
    display: flex;
    flex-direction: column;
    padding-left: 5px;
    padding-top: 10px;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    justify-content: space-between;
    /* background: linear-gradient(225deg, rgba(255,255,255,0.45) 0%, rgba(255,255,255,0.45) 100%); */
    /* background-color: aquamarine; */
}

.title-news-card-ncd h4 {
    font-family: 'ceraprobold';
    font-size: 20px;
    color: #2f3186;
    /* background-color: violet; */
}

.title-news-card-ncd p {
    font-size: 16px;
    /* background-color: blue; */

} 

.button-readmore-ncd{
    width: 90px;
    border: none;
    font-size: 14px;
    font-weight: 1000;
    color: white;
    padding: 3px 3px;
    background: linear-gradient(0deg, rgba(0,185,255,1) 0%, rgba(0,136,188,1) 45%);
    border-radius: 50px;
    cursor: pointer;
    transition: all 0.3s ease;
    margin-bottom: 10px;      
}
.button-readmore-ncd:hover{
    background: grey;
}


/* L   O   C   A   T   I   O   N */

.cover-background-fullsize-location-ncd{
    width: 100%;
    height: 30vh;
    justify-content: center;
    position: relative;;
    /* background-color: greenyellow; */
    /* background: linear-gradient(225deg, rgba(0,185,255,0) 0%, rgba(0,136,188,1) 100%); */
}

.container-footer-ncd{
    width: 100%;
    height: 100%;
    padding: 10px 0;
    display: flex;
    /* background-color: black; */
}

.container-location-ncd{
    width: 100%;
    display: flex;
    gap: 2%;
    justify-content: space-between;
    /* background-color:saddlebrown; */
}

/* -------------------------------------------------- */


.location-title-ncd{
    width: 20%;    
    position: relative;
    /* background-color: yellowgreen; */
}
.location-title-ncd h2{
    font-family: 'ceraprolight',arial, sans-serif;
    font-size: 50px;
    text-align: right;
    font-weight: 700;
    margin-top: 10px;
    /* background-color: #2f3186; */
}

/* ------------------------------------------------ */

.location-address-ncd{
    width: 20%;
    height: 100%;
    display: flex;
    /* background-color:tomato; */
}

.address-content-ncd{
    font-family: 'ceraprolight';
    font-size: 16px;
    text-align: left;
    font-weight: 1000;
    margin-top: 40px; 
    /* background-color: blue; */
}

/* ---------------------------------------------------- */

.location-phonenumber-ncd{
    width: 20%;
    height: 100%;
    display: flex;
    /* background-color: red; */
}

.location-phonenumber-ncd p{
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 40px;
    width: 100%;
    font-family: 'ceraprolight', arial, sans-serif;
    font-size: 16px;
    text-align: left;
    font-weight: 1000;  
    /* background-color: aliceblue; */
}
.location-phonenumber-ncd a{
    font-family: 'ceraprolight', arial, sans-serif;
    font-size: 16px;
    text-align: left;
    font-weight: 1000;
    text-decoration: none;
    display: flex;
    /* background-color:chocolate; */
}
.location-phonenumber-ncd img{
    width: 15px; 
    height: 15px;
    margin-top: 3px;
    align-items: center;
    /* background-color: #0070af; */
}


/* -------------------------------------------------------- */


.location-email-ncd{
    width: 20%;
    height: 100%;
    /* background-color: pink; */
}

.location-email-ncd p {
    font-family: 'ceraprolight', arial, sans-serif;
    font-size: 16px;
    text-align: left;
    font-weight: 1000;
    margin-top: 40px;
    /* background-color: aqua; */
}

.location-email-ncd a{
    font-family: 'ceraprolight', arial, sans-serif;
    font-size: 16px;
    text-align: left;
    font-weight: 1000;
    text-decoration: none;
    /* background-color: brown; */
}


/* C   O   P   Y   R    I    G   H   T     S   I   G   N */

.copyright-ijb-ncd{
    width: 100%;
    height: 10vh;
    padding: 0  50px;
    display: flex;
    background: linear-gradient(to bottom, skyblue, white);
}

.container-copyright-ijb-ncd{
    width: 100%;
    height: 100%;
    padding: 20px  0px;
    display: flex;
    justify-content: center;
    /* background-color: red; */
}

.content-copyright-ijb-ncd{
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    /* background-color: white; */
}

.icon-cp-ijb-ncd{
    position: relative;
    width: 20px;
    height: 20px;
    border-radius: 5px;
    /* background-color: red; */
}

.icon-cp-ijb-ncd .icon-ijb-ncd {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
    /* background-color: #2f3186; */
}

.text-cp-ijb-ncd {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    /* background-color: yellow; */
}

.text-cp-ijb-ncd h6 {
    font-family: 'ceraprolight', arial, sans-serif;
    font-size: 27px;
    text-align: center;
    /* background-color: aquamarine; */    
}

/* A   N   I   M   A   T   E   D   S   C   R   O   L   L */
/* <tambahkan di html file sebagai inline> */
/* data-aos="fade-up" --> style transisinya */
/* data-aos-offset="200" --> menentukan posisi munculnya animasi saat di scroll */
/* data-aos-delay="50" --> durasi ketika saat nya muncul, animasi delay sesuai waktu yang di setting, baru muncul */
/* data-aos-duration="1000" --> durasi berapa lama animasi dari awal muncul */
/* data-aos-easing="ease-in-out" */
/* data-aos-mirror="true" */
/* data-aos-once="false" */
/* data-aos-anchor-placement="top-center" */

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

/* H   E   A   D   E   R */
.header-img-fullsize-ncd{
    height: 500px;
}
.wrapper-ncd {
    padding-top: 0px;
    padding-left: 2rem;
}
.content-text-ncd{
    width: 60%;
    margin-left: 2rem;
    margin-top: 20px;
}
.text-title-style-ncd {
    width: 50%;
    font-size: 36px;
    line-height: 45px;
}
.display-paragraps-ncd{
    width: 80%;
}
/* ------------------------------------------- */
.content-text-profile-product-special-ncd p{
    font-size: 40px;
}
.card-slider-row1-2-ncd{
    height: 70%;
}
.text-profile-detail-product-special-ncd p{
    font-size: 12px;
}
/* ------------------------------------ */
.text-title-style-third-ncd {
    font-size: 36px;
    line-height: 45px;
}
.navigation-button-ncd{
height: 500px;
}



/* P  R  O  F  I  L  E   S  E  C  T  I  O  N*/
.header-img-fullsize-2-ncd {
    height: auto;
}

.content-text-profile-ncd{
    padding: 0;
}
.content-text-profile-ncd a {
    font-size: 27px;
}
.wrapper-image-small-cyrcle-ncd{
    width: 100px;
}
.title-name-profile-ncd{
    width: auto;
}
.text-profile-detail-ncd p{
    font-size: 14px;
}

.description-text-align-ncd{
    font-size: 12px;
}
/* P  R  O  D  U  C  T   S  E  C  T  I  O  N */

.cover-background-fullsize-ncd{
    height: auto;
}
.card-slider-product-row1-ncd{
    height: 400px;
}
.slide_content_ncd {
    padding: 20px 0;
}
.card_ncd {
    height: 400px;
    gap: 0;
}
.card_content_ncd{
    height: 50%;
    justify-content: unset;
}
.text-card-product-ncd {
height: 10px;
}
.text-card-product-ncd p{
    font-size: 12px;
}
.button_readmore_ncd{
    padding: 0 8px;
}
.text-card-product-ncd {
    height: 180px;
}

/* P   R   O   D   U   C   T    S   T   R   A   T   E   G   I   C */
.cover-background-strategic-partner-ncd{
    height: auto;
}
.title-sp-ncd h2{
    font-size: 34px;
    width: 100%;
}
.cover-background-strategic-partner-ncd{
    padding: 0;
}
.container-content-card-sp-ncd{
    height: 540px;
    padding: 10px 0;
}
.card-wow-coffee-ncd{
    justify-content: unset;
    padding: 10px 10px;
    gap: 10px;
    border-radius: 18px;
    /* background:linear-gradient(270deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.8) 0%); */
}
.card-wow-coffee-ncd p{
    text-align: left;
}
.card-bisi-ncd{
    justify-content: unset;
    padding: 10px 10px;
    gap: 10px;
    border-radius: 18px;
    /* background:linear-gradient(270deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.8) 0%); */
}
.card-bisi-ncd p{
    text-align: center;
}
.card-semesta-ncd{
    justify-content: unset;
    padding: 10px 10px;
    gap: 10px;
    border-radius: 18px;
    /* background:linear-gradient(270deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.8) 0%); */
}
.card-semesta-ncd{
    text-align: center;
}

/* Q  U  O  T  A  T  U  I  O  N   S  E  C  T  I  O  N */
.cover-background-fullsize-quotation-ncd{
    height: auto;
}
.submit-box{
    font-size: 18px;
}
.quotation-form-ncd{
    height: auto;
}
.quotation-form-ncd h2{
    height: auto;
}


/* N   E   W   S    S   E   C   I   O   N */
.cover-background-fullsize-news-ncd{
height: auto;
}
.container-ncd{
    padding: 0;
}
.container-news-ncd {
 padding: 0 10px;
}
.card-container-news-ncd{
    height: 400px;
    gap: 1rem;
    justify-content: space-between;
}
.card-news-content-ncd{
width: 450px;
}
/* L   O   C   A   T   I   O   N */
.cover-background-fullsize-location-ncd{
    height: auto;
}
.container-location-ncd{
    gap: 50px;
    justify-content: unset;
}
.location-title-ncd{
    width: 15%;
}
 .location-title-ncd h2{
    font-size: 30px;
}
.location-address-ncd{
    justify-content: center;
}
.address-content-ncd{
    font-size: 14px;
}
.location-phonenumber-ncd{
    align-items: center;
}
.location-phonenumber-ncd p{
    margin-top: unset;
    gap: 0px;
    font-size: 14px;
}
.location-phonenumber-ncd p a{
    font-size: 14px;
}
.location-email-ncd{
    width: 22%;
    display: flex;
    align-items: center;
 }
 .location-email-ncd p {
    margin-top: unset;
    font-size: 14px;
 }
 .location-email-ncd p a{
    font-size: 14px;
 }
}

/* TABLET VIEW */
 @media screen and (max-width: 768px){
/* N   A   V   B   A   R    S   E   C   T   I   O   N */
.search-box-ncd {
    display: none;
}
.menu-navbar-ncd{
    position:sticky;
    top: 0px;
    z-index: 999;
    height: 70px;
    padding: 0px;
}
.list-menu-navbar-ncd{
    width: 80%;
    justify-content: flex-end  
}
.list-menu{
    position: absolute;
    height: 100vh;
    z-index: -1;
    align-items: center;
    justify-content: space-evenly;
    flex-direction: column;
    transform: translateY(-100%);
    background-image: linear-gradient(to bottom, skyblue, white);
    transition: all 1s;
    overflow-y: hidden;
    scroll-snap-type: y mandatory;
}
nav ul.slider {
    transform: translateX(0);
}
.brand-logo-ncd {
    justify-content: center;
    align-items: center;
}
.brand-logo-ncd img{
    width: 55px;
}
.hamburger-menu-ncd{
    z-index: 3;
    display: flex;
}
 /* H       E       A       D       E       R */

.header-img-fullsize-ncd{
    height: 450px;
}
.wrapper-ncd{
    width: 100%; 
    height: 100%; 
}
.content-text-ncd{
    width: 70%;
    margin-top:5%;
}
.text-title-style-ncd {
    font-size: 27px;
    width: 45%;
    height: 80px;
    display: flex;
    line-height: 30px;
    justify-content: center;
    align-items: center;
}
.display-paragraps-ncd{
    width: 80%;
    margin-top: 0;
    padding-left: 0;
    font-size: 14px;
}
/* ------------------------------------------------ */
.content-text-profile-product-special-ncd{
    margin-top: 30px;
}
.content-text-profile-product-special-ncd p{
    font-size: 30px;
}
.card-slider-row1-2-ncd{
    height: 80%;
}
.title-name-profile-product-special-ncd{
    width: 100%;
}
.card-slider-row1-2-ncd button{
    width: 35%;
    height: 18px;
}
/* ------------------------------------------------ */
.content-text-third-slide-ncd{
    clip-path: polygon(90% 0, 100% 0, 100% 100%, 11% 100%);
    padding: 10rem 1rem 1rem 4rem;
    background: linear-gradient(240deg, rgba(255,255,255,1) 20%, rgba(0,112,175,0.6168592436974789) 100%);
    justify-content: center;
    padding-bottom: 0;
}
.text-title-style-third-ncd {
    width: 55%;
    margin-left: 270px;
    font-size: 27px;
    text-align: right;
    line-height: 40px;
}
.display-paragraps-third-slide-ncd{
    width: 55%;
    margin-left: 270px;
    text-align: justify;
    font-size: 14px;
}
.content-text-third-slide-ncd button{
    padding: 0 8px;
}

 /* P  R  O  F  I  L  E   S  E  C  T  I  O  N */
.header-img-fullsize-2-ncd {
    height: auto;
}
.wrapper-double-row-ncd{
    gap: 10px;
}
.card-slider-row1-ncd{
    width: 90%;
    height: auto;
}
.card-slider-profile-row2-ncd{
padding: 0;
}

/* P   R   O   D   U   C   T    S   E   C   T   I   O   N */
.card-text-product-ncd{
    padding: 0 0;
}
.card-slider-product-row1-ncd{
    height: 450px;
    align-items: unset;
}
.card_ncd {
    height: 420px;
}
.card_image_ncd{
    height: 40%
}
.card_content_ncd{
    height: auto;
}
.text-card-product-ncd {
    height: 210px;
}
.button_readmore_ncd{
    font-size: 14px;
}
/* P   R   O   D   U   C   T     S   T   R   A   T   E   G   I   C */

.title-sp-ncd h2{
    font-size: 27px;
}
.container-content-card-sp-ncd{
height: auto;
}
.card-wow-coffee-ncd{
    justify-content: unset;
    gap: 10px;
    height: 405px;
}
.card-wow-coffee-ncd h3{
    font-size: 16px;
}
.card-wow-coffee-ncd p{
    font-size: 12px;
    text-align: left;
}
/* ------------------------------------------- */
.card-bisi-ncd{
    height: 405px;
    justify-content: unset;
    gap: 10px;
}
.card-bisi-ncd h3{
    font-size: 16px;
    text-align: center;
}
.card-bisi-ncd p{
    font-size: 12px;
    text-align: center;
}
.card-semesta-ncd{
    height: 405px;
    justify-content: unset;
    gap: 10px;
}
.card-semesta-ncd h3{
    font-size: 16px;
    text-align: right;
}
.card-semesta-ncd p{
    font-size: 12px;
    text-align: right;
}

/* Q   U   O   T   A   T   I   O   N */
.cover-background-fullsize-quotation-ncd{
    height: auto;
}
.countainer-form-ncd{
    height: auto;
}

.countainer-form-ncd h2{
    font-size: 42px;
    height: auto;
}

.quotation-container-ncd{
    height: auto;
    display: flex;
    padding: 0 20px ;
}
.quotation{
    max-width: 100%;
    margin: 0;
}

/* N E W S */
.cover-background-fullsize-news-ncd{
    height: auto;
}
.container-ncd{
    padding: 10px 5px;
    height: auto;   
}
.container-news-ncd {
    padding: 5px 5px;
    height: auto;
}
.content-news-ncd{
    padding-top: 10px;
}
.title-news-section-ncd {
    height: auto;
}
.title-news-section-ncd h4{
    font-size: 46px;
    text-align: left;
}
.card-container-news-ncd{ 
height: 360px;
padding: 0px 0;
gap: 1.5rem;  
} 
.card-news-content-ncd{
   width: 350px;
   height: 160px;
   padding-right: 5px; 
}
.image-card-news-ncd{
    width: 80%;
    height: 100%;
    border-bottom-left-radius: 10px;
}
.title-news-card-ncd{
    height: 175px;
    /* gap: 1rem; */
    justify-content: space-between;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}
.title-news-card-ncd h4 {
    width: 100%;
    font-size: 14px;
    white-space:initial;;
}
.title-news-card-ncd p {
    width: 100%;
    font-size: 12px;
    white-space:initial;;
}
.button-readmore-ncd{
    padding: 1px 1px;
    font-size: 12px;
}

/* L  O  C  A  T  I  O  N   S  E  C  T  I  O  N */
.container-location-ncd{
    gap: 5px;
    justify-content: unset;
}
.location-title-ncd{
    width: 15%;   
}
.location-title-ncd h2{
    font-size: 27px;
}
.address-content-ncd{
    font-size: 12px;
}
.location-phonenumber-ncd {
    align-items: center;
}
.location-phonenumber-ncd p{
    margin-top: 0;
    font-size: 14px;
}
.location-phonenumber-ncd a{
    font-size: 12px;
}
.location-email-ncd{
    width: 26%;
    font-size: 14px;
}
.location-email-ncd p{
    font-size: 14px;
}
.location-email-ncd p a{
    font-size: 12px;
}
.location-email-ncd a{
    font-size: 12px;
}
}


/* M  O  B  I  L  E   L  A  R  G  E   V  I  E  W */
@media screen and (max-width: 576px){
/* N   A   V    B   A   R */
.brand-logo-ncd img{
width: 50px;
}
.list-menu li a {
    font-size: 12px;
}
/* H       E       A       D       E       R */
.header-img-fullsize-ncd {
    width: 100%;
    height: 550px;
}
.single-row-content-ncd{
    display: flex;
    justify-content: center;
    align-items: center;
}
.gradient{
    display: none;
}
.wrapper-ncd{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.content-text-ncd{
    width: 80%;
    height: auto;
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-left: 0;
    background: linear-gradient(90deg, rgba(255,255,255,0.8) 100%, rgba(0,112,175,0.6168592436974789) 100%);
}
.text-title-style-ncd {
    font-size: 27px;
    width: 100%;
    height: 80px;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}
.display-paragraps-ncd{
    width: 100%;
    margin-top: 0;
    text-align: justify;
}
/* ------------------------------------------------ */
.content-text-profile-product-special-ncd{
    margin-top: 10px ;
}
.container-background-slide-2-product-special{
flex-direction: column;
}
.display-hp-1{
    width: 100%;
    height: 55%;
}
.display-hp-2{
    width: 100%;
    height: 50%;
}
.content-text-product-spc-ncd{
flex-direction: column;
}

.card-slider-row1-2-ncd{
    width: 70%;
    height: 45%;
}
/* ------------------------------------------------ */
.content-text-third-slide-ncd{
    clip-path:none;
    width: 80%;
    height: 250px;
    padding: 0px 10px;
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 10px;
    background: linear-gradient(90deg, rgba(255,255,255,0.8) 100%, rgba(0,112,175,0.6168592436974789) 100%);
}
.text-title-style-third-ncd {
    width: 100%;
    height: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    margin: 0;
}
.display-paragraps-third-slide-ncd{
    width: 100%;
    height: 200px;
    margin: 0;
    display: flex;
    align-items: center;
}

/* P   R   O   F   I   L   E     S   E   C   T   I   O   N */
.header-img-fullsize-2-ncd {
background-attachment: unset;
}
.wrapper-double-row-ncd{
    justify-content: unset;
}
.content-text-profile-ncd{
    height: auto;
}

/* P  R  O  D  U  C  T   S  E  C  T  I  O  N */
.card-slider-product-row1-ncd{
height: 400px;
}
.card_ncd {
    width: 47.5%;
    height: 350px;
}
.card_content_ncd{
    gap: 10px;
}
.card_image_ncd{
    height: 50%
}
.title-card-product-ncd h2{
    font-size: 18px;
}
.text-card-product-ncd {
    height: 120px;
}
.text-card-product-ncd p{
    font-size: 12px;
    line-height: 0.8rem;
}
.arrow {
    width: 20px;
}
svg {
    padding: 5px 0;
}
polyline{
    stroke:#2f3186 ;
}
.left:hover polyline,
.left:focus polyline {
    stroke:white;
}
.right:hover polyline,
.right:focus polyline {
    stroke:white;
} 
/* S  T  R  A  T  E  G  I  C   P  A  R  T  N  E  R */
.cover-background-strategic-partner-ncd{
    height: auto;
}
.container-sp-ncd{
    height: auto;
    justify-content: space-between;
    padding: 20px 0;
}
.title-sp-ncd h2{
    font-size: 18px;
}
.container-content-card-sp-ncd{
    flex-direction: column;
    height: auto;
    padding: 0 50px;
    gap: 20px;
}
.card-wow-coffee-ncd{
    width: 100%;
    height: auto;
    margin-top: 10px;
    background:linear-gradient(270deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.8) 0%);
    border-radius: 10px;
    padding: 10px;
}
.card-wow-coffee-ncd img{
    width: 100px;
}
.card-wow-coffee-ncd p{
    text-align: justify;
}
.card-bisi-ncd{
    width: 100%;
    height: auto;
    background:linear-gradient(270deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.8) 0%);
    border-radius: 10px;
    padding: 10px;
}
.card-bisi-ncd a{
    text-align: center;
}
.card-bisi-ncd img{
    width: 100px;
}
.card-bisi-ncd p{
    text-align: justify;
}
.card-semesta-ncd{
    width: 100%;
    height: auto;
    background:linear-gradient(270deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.8) 0%);
    border-radius: 10px;
    padding: 10px;
}
.card-semesta-ncd img{
    width: 100px;
}
.card-semesta-ncd p{
    text-align: justify;
}

/* Q   U   O   T   A   T   I   O   N */
.quotation-form-ncd h2{
font-size: 36px;
text-align: center;
height: auto;
padding: 10px 0;
}
.quotation{
padding: 10px 10px;
flex-direction: column;
align-items: center;
}
.subject-box{
width: 100%;
margin-right: 0;
}
.name-box{
width: 100%;
margin-bottom: 0;
}

.phone-box{
width: 100%;
}
.submit-box{
width: 50%;
}

/* N   E   W   S */
.cover-background-fullsize-news-ncd{
    height: auto;
}
.container-ncd{
 padding: 5px 5px;   
}
.container-news-ncd {
    padding: 0 5px;
}
.title-news-section-ncd h1{
    font-size: 36px;
    text-align: center;
}
.card-container-news-ncd{
    width: 100%;
    height: 500px;
    padding: 0 50px;
    gap: 50px;
    flex-direction: column;
    flex-wrap: wrap;
    align-content:unset ;
    justify-content: center;
    overflow-x:auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    scroll-snap-align: start;
}
.card-news-content-ncd{
    width: 100%;
    height: 450px;
    flex-direction: column;
    padding: 0;    
}
 .image-card-news-ncd{
    width: 100%;
    height: 250px;
    border-bottom-left-radius: 0;
    border-top-right-radius: 10px;
}
.title-news-card-ncd{
    width: 100%;
    height: 180px;
    align-items: center;
    padding: 5px 5px;
    gap: 1rem;
    border-top-right-radius: 0;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}
.title-news-card-ncd h4 {
    width: 100%;
    font-size: 18px;
    text-align: center;
}
.title-news-card-ncd p {
    text-align: center;
    font-size: 16px;
    width: 100%;
}

/* L    O    C    A    T    I    O    N */
.container-location-ncd{
    height: 100%;
    display: flex;
    flex-direction: row;
}
.cover-background-fullsize-location-ncd{
    width: 100%;
    height: auto;
}
.container-footer-ncd{
    height: auto;
    padding: 0;
}
.container-location-ncd{
    flex-direction: column;
    justify-content: unset;
    align-items: center;
    gap: 0;
}
.location-title-ncd{
    width: 100%;
}
.location-title-ncd h2{
    text-align: center;
    margin-top: 0;
    font-size: 22px;
    font-family: 'ceraprobold';
}
.location-address-ncd{
    align-items: center;
    width: 100%;
    padding: 0 10px;
}
.address-content-ncd{
    font-size: 12px;
    text-align: center;
    margin-top: 0;
}
.location-phonenumber-ncd{
    width: 100%;
}
.location-phonenumber-ncd a{
    text-align: center;
    font-size: 12px;
}
.location-email-ncd{
    width: 100%;
}
.location-phonenumber-ncd p{
    text-align: center;
}
.location-phonenumber-ncd img{
    width: 10px;
    height: 10px;
}
.location-phonenumber-ncd p a{
    text-align: center;
    font-size: 12px;
    justify-content: center;
}
.location-email-ncd{
    width: 100%;
    display: flex;
    justify-content: center;
}
.location-email-ncd p {
    font-size: 12px;
    text-align: center;
    margin: 0;
}
.location-email-ncd a{
    font-size: 12px;
    text-align: center;
}

/* C O P Y R I G H T */
.icon-cp-ijb-ncd{
    width: 10px;
    height: auto;
}
.text-cp-ijb-ncd h6 {
    font-size: 18px;
}
}



/* M  O  B  I  L  E   L  A  R  G  E   V  I  E  W */
@media screen and (max-width: 426px){
/*H       E       A       D       E       R*/
.header-img-fullsize-ncd {
    width: 100%;
    height: 450px;
}
.content-text-ncd{
    width: 80%;
    margin: 0;
    height: auto;
    padding: 10px 0;
    gap: 10px;
}
.text-title-style-ncd {
    width: 100%;
    height: auto;
    font-size: 18px;
}
.display-paragraps-ncd{
    font-size: 12px;
    padding: 10px ;
}
/* ------------------------------------------------------ */
.content-text-profile-product-special-ncd{
    margin-top: 10px ;
}
.content-text-profile-product-special-ncd p{
    font-size: 18px ;
}
.title-name-profile-product-special-ncd h2{
font-size: 18px;
}
.display-hp-large{
    display: none;
}
.double-row-content-product-special-ncd{
    justify-content: unset;
    align-items: unset;
}
.card-slider-row1-2-ncd{
height: 45%;
padding: 0 5px;
justify-content: space-between;
}
.text-profile-detail-product-special-ncd p{
    letter-spacing: 0;
}.card-slider-row1-2-ncd button{
    height: 15px;
}
/* ------------------------------------------------------ */
.content-text-third-slide-ncd{
    height: auto;
    padding: 10px;
}
.text-title-style-third-ncd {
    font-size: 18px;
    line-height: 20px;
}
.display-paragraps-third-slide-ncd{
    font-size: 12px;
}
/* P R O F I L E  S E C T I O N */
.content-text-profile-ncd a{
    font-size: 25px;

}
.content-text-profile2-ncd {
    padding: 0;
}
.card-slider-row1-ncd{
    /* width: 100%; */
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 15px;
}
.title-name-profile-ncd{
padding: 0;
}
.title-name-profile-ncd h2{
    font-size: 16px;
    text-align: center;
}.title-name-profile-ncd p{
    font-size: 16px;
    text-align: center;
}
.text-profile-detail-ncd p{
    font-size: 12px;
}
.card-slide-2-content-ncd ul{
    padding: 10px;
}

/* P  R  O  D  U  C  T   S  E  C  T  I  O  N */
.card-slider-product-row1-ncd{
height: 350px;
}
.card_ncd {
    width: 100%;
    height: 100%;
    justify-content: unset;
}
.card_content_ncd{
    height: 40%;
}
.card_image_ncd {
    height: 60%;
}
.text-card-product-ncd {
    height: 180px;
}

/* P   R   O   D   U   C   T    S   T   R   A   T   E   G   I   C */
.title-sp-ncd h2{
    width: 70%;
}

/* Q    U    O    T    A    T    I    O    N */

.quotation-form-ncd h2{
    font-size: 36px;
    text-align: center;
    height: auto;
    padding: 10px 0;
}
.quotation{
    padding: 10px 10px;
    flex-direction: column;
    align-items: center;
}
.subject-box{
    width: 100%;
    margin-right: 0;
}
.name-box{
    width: 100%;
    margin-bottom: 0;
}

.phone-box{
    width: 100%;
}
.submit-box{
    width: 50%;
}

/* N E W S */
.card-container-news-ncd{
    padding: 0 10px;
}
.card-news-content-ncd{
    padding: 0;
    height: 420px;
}
/* L O C A T I O N */

.cover-background-fullsize-location-ncd{
    width: 100%;
    height: auto;
}
.container-footer-ncd{
    height: auto;
    padding: 0;
}
.container-location-ncd{
    flex-direction: column;
    justify-content: unset;
    align-items: center;
    gap: 0;
}
.location-title-ncd{
    width: 100%;
}
.location-title-ncd h2{
    text-align: center;
    margin-top: 0;
    font-size: 22px;
    font-family: 'ceraprobold';
}
.location-address-ncd{
    width: 100%;
    padding: 0 10px;
}
.address-content-ncd{
    font-size: 12px;
    text-align: center;
    margin-top: 0;
}
.location-phonenumber-ncd{
    width: 100%;
}
.location-phonenumber-ncd a{
    text-align: center;
    font-size: 12px;
}
.location-email-ncd{
width: 100%;
}
.location-phonenumber-ncd p{
    text-align: center;
}
.location-email-ncd{
    width: 100%;
}
.location-email-ncd p {
    font-size: 12px;
    text-align: center;
    margin: 0;
}
.location-email-ncd a{
    font-size: 12px;
    text-align: center;
}

/* C O P Y R I G H T */
.icon-cp-ijb-ncd{
    width: 10px;
    height: auto;
}
.text-cp-ijb-ncd h6 {
    font-size: 18px;
}
}


/* MOBILE MEDIUM VIEW */
@media screen and (max-width: 376px){

/* h      e      a      d      e      r */
.text-title-style-ncd {
    line-height: 20px;
}
.display-paragraps-ncd{
    line-height: 15px;
}
/* ------------------------------------------------------ */
.text-title-style-third-ncd {
    height: auto;
}
.display-paragraps-third-slide-ncd{
    height: auto;
    line-height: 15px;
}
/* P R O F I L E  S E C T I O N */
.double-row-content-ncd{
    padding: 0 1rem;
}

/* P  R  O  D  U  C  T   S  E  C  T  I  O  N */
.card-slider-product-row1-ncd{
    height: 405px;
}
.card_image_ncd {
    width: 315px;
}
.card_ncd {
    width: 315px;
}
.card-slider-product-row1-ncd{
    padding: 0px;
}

/* P   R   O   D   U   C   T    S   T   R   A   T   E   G   I   C */
.title-sp-ncd h2{
    width: 100%;
}
.container-content-card-sp-ncd{
    padding: 0 10px;
}
/* Q U O T A T I O N */
.submit-box{
    width: 60%;
}
}

@media screen and (max-width: 352px){
/* H   E   A   D   E   R */
    .card-slider-row1-2-ncd{
    height: 49%;
}
.text-profile-detail-product-special-ncd p{
    letter-spacing: 0;
    text-align: left;
}
.card-slider-row1-2-ncd button{
    font-size: 9px;
}

/* P  R  O  D  U  C  T   S  E  C  T  I  O  N */
.card-slider-product-row1-ncd{
    height: 450px;
}

.card_ncd {
    width: 100%;
}
.card_image_ncd {
    width: 100%;
}
/* Q U O T A T I O N */

.submit-box{
    width: 65%;
}

/* C O P Y R I G H T */
.icon-cp-ijb-ncd{
    width: 10px;
    height: auto;
}
.text-cp-ijb-ncd h6 {
    font-size: 12px;
}
}


@media screen and (max-width: 320px){
.content-text-profile-ncd a{
    font-size: 18px;
}

/* H  E  A  D  E  R   S  E  C  T  I  O  N */
.title-name-profile-product-special-ncd h2{
    font-size: 14px;
}
.content-text-profile-product-special-ncd p{
    font-size: 14px;
}

/* Q U O T A T I O N */

.quotation-form-ncd h2{
    font-size: 26px;
}
.submit-box{
    width: 65%;
}

/* C O P Y R I G H T */
.icon-cp-ijb-ncd{
    width: 10px;
    height: auto;
}
.text-cp-ijb-ncd h6 {
    font-size: 12px;
}
}

/* whatsapp float button */
.dd-m-whatsapp {
    position: fixed;
    z-index: 99999;
    bottom: 20px;
    right: 20px;
    width: 60px;
    height: 60px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
       -moz-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-border-radius: 50%;
       -moz-border-radius: 50%;
            border-radius: 50%;
    background-color: #25d366;
    -webkit-transition: 0.3s all ease;
    -o-transition: 0.3s all ease;
    -moz-transition: 0.3s all ease;
    transition: 0.3s all ease;
    cursor: pointer;
    text-decoration: none;
    color: #25d366;
  }
  
  .dd-m-whatsapp:hover {
    -webkit-transform: translateY(-5px);
       -moz-transform: translateY(-5px);
        -ms-transform: translateY(-5px);
         -o-transform: translateY(-5px);
            transform: translateY(-5px);
    -webkit-box-shadow: 0 5px 15px 2px rgba(37, 211, 102, 0.3);
       -moz-box-shadow: 0 5px 15px 2px rgba(37, 211, 102, 0.3);
            box-shadow: 0 5px 15px 2px rgba(37, 211, 102, 0.3);
  }
  
  .dd-m-whatsapp .icon {
    width: 50%;
    height: 50%;
    display: block;
    fill: #fff;
    -webkit-transform: translateX(1px);
       -moz-transform: translateX(1px);
        -ms-transform: translateX(1px);
         -o-transform: translateX(1px);
            transform: translateX(1px);
  }
  
  .dd-m-whatsapp .icon {
    width: 70%;
    height: 70%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 39 39'%3E%3Cpath d='M10.7 32.8l.6.3c2.5 1.5 5.3 2.2 8.1 2.2 8.8 0 16-7.2 16-16 0-4.2-1.7-8.3-4.7-11.3s-7-4.7-11.3-4.7c-8.8 0-16 7.2-15.9 16.1 0 3 .9 5.9 2.4 8.4l.4.6-1.6 5.9 6-1.5z' fill='%2325d366'/%3E%3Cpath d='M32.4 6.4C29 2.9 24.3 1 19.5 1 9.3 1 1.1 9.3 1.2 19.4c0 3.2.9 6.3 2.4 9.1L1 38l9.7-2.5c2.7 1.5 5.7 2.2 8.7 2.2 10.1 0 18.3-8.3 18.3-18.4 0-4.9-1.9-9.5-5.3-12.9zM19.5 34.6c-2.7 0-5.4-.7-7.7-2.1l-.6-.3-5.8 1.5L6.9 28l-.4-.6c-4.4-7.1-2.3-16.5 4.9-20.9s16.5-2.3 20.9 4.9 2.3 16.5-4.9 20.9c-2.3 1.5-5.1 2.3-7.9 2.3zm8.8-11.1l-1.1-.5s-1.6-.7-2.6-1.2c-.1 0-.2-.1-.3-.1-.3 0-.5.1-.7.2 0 0-.1.1-1.5 1.7-.1.2-.3.3-.5.3h-.1c-.1 0-.3-.1-.4-.2l-.5-.2c-1.1-.5-2.1-1.1-2.9-1.9-.2-.2-.5-.4-.7-.6-.7-.7-1.4-1.5-1.9-2.4l-.1-.2c-.1-.1-.1-.2-.2-.4 0-.2 0-.4.1-.5 0 0 .4-.5.7-.8.2-.2.3-.5.5-.7.2-.3.3-.7.2-1-.1-.5-1.3-3.2-1.6-3.8-.2-.3-.4-.4-.7-.5h-1.1c-.2 0-.4.1-.6.1l-.1.1c-.2.1-.4.3-.6.4-.2.2-.3.4-.5.6-.7.9-1.1 2-1.1 3.1 0 .8.2 1.6.5 2.3l.1.3c.9 1.9 2.1 3.6 3.7 5.1l.4.4c.3.3.6.5.8.8 2.1 1.8 4.5 3.1 7.2 3.8.3.1.7.1 1 .2h1c.5 0 1.1-.2 1.5-.4.3-.2.5-.2.7-.4l.2-.2c.2-.2.4-.3.6-.5s.4-.4.5-.6c.2-.4.3-.9.4-1.4v-.7s-.1-.1-.3-.2z' fill='%23fff'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 70%;
  }