/* new css */
.bg-dark-orange{
  background-color: #CC8236;
}
.img-footer-testy{
  width: 110px
}
.subtitle-desc{
  font-size: 12pt;
}
.desc-contact-us{
  font-size: 12pt;
}
.testy-name{
  font-size: 12pt;
}
.desc-testy{
  font-size: 12pt;
}
.txt-copyright{
  font-size: 0.5em;
  height: 2vh;
}
.home-latest-news{
  padding-top: 1rem;
}
.square-container {
  width: 100%; /* Adjust this value to the desired size */
  position: relative;
}

.square-content {
  padding-top: 100%; /* Creates a 1:1 aspect ratio (height = width) */
  position: relative;
}

.square-content img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.desc-our-brand{
  font-size: 12pt;
}
.container-img-icon-discovering{
  position: relative;
  width: 70%;
}
.date-news{
  font-size: 10pt;
}
.shadow-nav{
  box-shadow: 0px 0px 8px 5px rgba(32, 32, 32, 0.295);
}
.container-img-testimony {
  /* max-width: 280px; */
  /* width: 280px; */
  /* height: 280px; */
  width: 100%;
  overflow: hidden;
  position: relative;
}

.title-testimony{
  font-size: 35pt;
}

.title-being-savorian{
  font-size: 27pt;
}


.container-img-testimony img {
  object-fit: cover;
  object-position: center;
  width: 100%;
  height: 100%;
}

.bg-cream{
  background-color: #FDF8F7;
}

.bg-icon-social-index{
  width: 30px;
  height: 30px;
  display: flex;
  justify-content: center;
}

.bg-icon-social-index:hover{
  cursor: pointer;
}

.bg-icon-social{
  width: 35px;
  height: 35px;
  display: flex;
  justify-content: center;
}

.bg-icon-social:hover{
  cursor: pointer;
}

.bg-icon-social-parent{
  width: 70px;
  height: 70px;
  display: flex;
  justify-content: center;
  margin: 10px 20px;
}

.bg-icon-social-parent:hover{
  cursor: pointer;
}

hr.line-4 {
  border-top: 4px solid lightslategray;
  margin-bottom: 0;
}

hr.line-3 {
  border-top: 3px solid rgb(125, 129, 132);
  margin-bottom: 0;
}

hr.line-2-mobile {
  height:1px;
  border:none;
  color:#EE3723;
  background:#EE3723;
  opacity: 75%;'
}

.text-link-color{
  color: #0d6efd;
}

.text-link-black:hover{
  cursor: pointer;
  color: black;
}

.accordion-button:not(.collapsed)::before {
  background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'><path fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/></svg>") !important;
  transform: rotate(-180deg);
}

.accordion-button::before {
  flex-shrink: 0;
  width: 1.25rem;
  height: 1.25rem;
  margin-right: 1rem;
  content: "";
  background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'><path fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/></svg>") !important;
  background-repeat: no-repeat;
  background-size: 1.25rem;
  transition: transform .2s ease-in-out;
  color: white;
}

.accordion-button-bottom::before {
  flex-shrink: 0;
  width: 1.25rem;
  height: 1.25rem;
  /* margin-right: 1rem; */
  content: "";
  background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23D22737'><path fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/></svg>") !important;
  background-repeat: no-repeat;
  background-size: 1.25rem;
  transition: transform .2s ease-in-out;
  display: block;
  transform: rotate(-180deg);
}

.accordion-button-bottom:hover::before {
  scale: 1.3
}

.accordion-button:not(.collapsed) {
  background-color: #D22737;
  color: white;
}

.accordion-button {
  background-color: #D22737;
  color: white;
}

.accordion-button:focus {
  z-index: 3;
  border-color: #ffffff;
  outline: 0;
  box-shadow: 0 0 0 0rem rgba(13, 110, 253, 0.25);
}

.accordion-button::after {
  display: none !important;
}

.accordion-header {}

.container-img-discovering {
  width: 100%;
  /* height: 350px; */
  overflow: hidden;
  position: relative;
  margin-left: 0px;
}

.container-img-our-brand-top {
  width: 100%;
  /* height: 70vh; */
  overflow: hidden;
  position: relative;
  margin-left: 0px;
}

.container-img-our-brand-top img {
  object-fit: cover;
  object-position: center;
  width: 100%;
}

.container-img-mother-brand-top {
  /* width: 100%; */
  max-height: 600px;
  overflow: hidden;
  position: relative;
  margin-left: 0px;
}

.container-img-mother-brand-top img {
  object-fit: cover;
  object-position: center;
  width: 100%;
  height: 100%;
}

.container-img-business-top {
  width: 100%;
  /* height: 350px; */
  overflow: hidden;
  position: relative;
  margin-left: 0px;
}

.container-img-business-top img {
  object-fit: cover;
  object-position: center;
  width: 100%;
}

.container-img-business-side {
  width: 100%;
  height: 250px;
  overflow: hidden;
  position: relative;
  margin-left: 0px;
}

.container-img-business-side img {
  object-fit: cover;
  object-position: center;
  width: 100%;
  height: 100%;
  /* margin: 0px 5px; */
}

.container-img-business-long {
  width: 100%;
  height: 250px;
  overflow: hidden;
  position: relative;
  margin-left: 0px;
}

.container-img-business-long img {
  object-fit: cover;
  object-position: center;
  width: 100%;
  height: 100%;
  /* margin: 0px 5px; */
}

.container-img-facility {
  width: 100%;
  height: 250px;
  overflow: hidden;
  position: relative;
  margin-left: 0px;
  /* width: 350px; */
}

.container-img-facility img {
  object-fit: contain;
  object-position: center;
  /* width: 100%; */
  height: 100%;
  margin-left: -25px;
}

.container-img-business-unit {
  width: 100%;
  /* max-width: 33%; */
  height: 230px;
  overflow: hidden;
  position: relative;
  margin-left: 0px;
}

.container-img-business-unit img {
  object-fit: cover;
  object-position: center;
  width: 100%;
  min-width:100%;
  height: auto;
}

.container-logo-business-unit {
  width: 100%;
  /* max-width: 33%; */
  height: 80px;
  overflow: hidden;
  position: relative;
  margin-left: 0px;
  margin-top: 1rem;
}

.container-logo-business-unit img{
  object-fit: contain;
  object-position: center;
  width: 100%;
  height: -webkit-fill-available;
  /* padding-top: 10px; */
}

.container-img-discovering img {
  object-fit: cover;
  object-position: center;
  width: 100%;
}

.container-img-full-width {
  position: relative;
  width: 100%;
}

.container-two {
  /* height: 300px; */
  column-width: 100%;
  overflow: hidden;
  column-count: 2;
}

.text {
  margin: 0;
  padding: 0;
}

.footer-facility {
  font-size: 21pt;
  font-weight: bold
}

.img-cert {
  /* width: 100%; */
  /* max-width: 500px; */
  /* height: 450px; */
  overflow: hidden;
  position: relative;
  margin-left: 0px;
}

.img-cert img {
  object-fit: cover;
  object-position: center;
  /* width: 100%; */
  max-height: 100px;
}

.div-facility {
  margin: 3rem 0px;
}

.award-title {
  font-size: 20pt;
  font-weight: bold;
}
.pagination-vertical{
  position: absolute;
  margin-top: -50px;
}
.pagination-vertical-news{
  /* position: absolute;
  margin-top: -30px; */
  position: relative;
  visibility: hidden;
  top: -50px;
  display: block;
}
.pagination-vertical-brand{
  /* position: absolute;
  margin-top: -80px; */
  position: relative;
  visibility: hidden;
  top: -50px;
  display: block;
}
.modal-content-menu{
  width: 375px; 
  background-color:rgb(235 231 231 / 87%); 
  border-radius:25px
}
.modal-content-recruitment{
  background-color:rgb(235 231 231 / 87%); 
  border-radius:25px
}
.curved-savoria{
  border-top-left-radius: 80% 10%;
  border-top-right-radius: 80% 10%;
}
.banner-line{
  height: 95%;
  border-color: white;
  margin-top: 3%;
}
.logo-banner{
  /* width: 250px;  */
  width: 200px; 
  position:absolute; 
  top:0px
}
a.rounded-news .description-latest-news{
  color: #C6C6C6;
  /* text-align: justify; */
}
a.rounded-news:hover .description-latest-news{
  color: #818181;
}

a.rounded-news .title-latest-news {
  color: #BBBBBB;
  font-weight: 700;
}

a.rounded-news:hover .title-latest-news {
  color: #585858;
}

/* a .description-latest-news:hover{
  color: #818181;
} */

#pagination {
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  right: 30px;
  list-style: none;
  z-index: 10;
}

#pagination .dots{
    border-radius: 50%; background-color: rgba(255, 255, 255, 0);
    margin: 15px 0px;
    box-shadow: 0 0 5px #585757;
    scale: 0.7;
}

#pagination .dots:hover{
    border-radius: 50%; background-color: #9e9e9e;
    scale: 0.9;
    transition: all .2s ease;
}

#pagination .dots.active{
    border-radius: 50%; background-color: #9e9e9e;
    scale: 1.2;
    transition: all .2s ease;
}

.container-img-s2 {
  width: 100%;
  /* height: 750px; */
  height: 680px;
  overflow: hidden;
  position: relative;
  margin-left: 0px;
  /* margin-top: 30px; */
}

.container-img-s2 img {
  object-fit: cover;
  object-position: center;
  height: 565px;
  width: 100%;
  margin-top: 30px;
  scale: 1.3;
}

.container-img-two {
  /* width: 100%; */
  height: 100%;
  /* height: 250px; */
  overflow: hidden;
  position: relative;
  margin-left: 0px;
}

.container-img-two img {
    object-fit: cover;
        object-position: center;
        width: 100%;
        height: 100%;
        /* height:500px; */
        /* margin-top: -200px; */
  /* scale: 1.3; */
}

.container-img-two:hover .transparent-box-career{
  cursor: pointer;
  background-color: #D22737;
  z-index: 10;
  height: 500px;
  opacity: 0.9;
  margin-top: -400px;
}

.container-img-two:hover .transparent-box{
  cursor: pointer;
  background-color: #D22737;
  z-index: 10;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0.9;
  /* margin-top: -404px; */
}

.container-img-two img.img-career {
  object-fit: cover;
  object-position: center;
  /* height:500px; */
  /* margin-top: -100px; */
  margin-left: 0px;
}

.text-centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.carousel-caption {
    color: black;
    /* right: 50%; */
    text-align: center;
    /* max-width: 500px; */
    /* left: auto; */
    /*top: auto;*/
  top: 50%;
  transform: translateY(-50%);
  bottom: initial;
}

#logo-sticky{
  width: 14%; 
  position:absolute; 
  top:3px;
  left: 43%;
  /* margin-top: 5%; */
  -webkit-filter: drop-shadow(0px 3px 6px rgba(32, 32, 32, 0.601));
  filter: drop-shadow(0px 3px 6px rgba(32, 32, 32, 0.601));
}

.link:hover{
cursor: pointer;
}

#savoria-menu{
  width: 30px;
}
#bg-image-section2 {
    background-image: url('../images/slices/desktop/section2.jpg');
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    width: 100%;
    height: 95%;
    min-height: 690px;
    /* border-radius: 50% 50% 0 0; */
  margin-top: 30px;
 }

 .btn-rounded{
    border-radius: 1rem;
 }

 .title-glance {
    font-size: 40pt;
    font-weight: bold;
  }

  .sub-glance{
    font-size: 22px;
  }
.text-red-savoria{
    color: #D22737;
  }
  
  .icon-social{
    height: 25px;
    width: 25px;
    padding: 3px;
  }

  .icon-social-index{
    height: 20px;
    width: 20px;
    padding: 3px;
  }

  .icon-social-parent{
    height: 50px;
    width: 50px;
    padding: 6px;
  }
  
  /* end new css */
  .container-img {
    width: 60px;
    /* margin-left: 10px; */
    /* margin-right: 10px; */
  }
  
  .uptext{
    position: relative;
    bottom: 4px;
    font-size: 11px;
  }
  
  .title-news{
    margin-bottom: 40px;
  }
  
  .img-olshop{
    max-height: 60px;
  }
  
  .all-product {
    height: 100%;
    width: 100%;
    max-height : 450px;
    max-width: 450px;
  }
  
  .logo-our:hover {
    transform: scale(1.1); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
    -webkit-transform: scale(1.1);
    cursor: pointer;
  }
  img.logo-our {
    transition: transform .5s ease;
  }
  .container-social-media{
    position: absolute;
    bottom: 12%;
    width: 100%;
  }
  .img-social-media{
    height: 60px;
  }
  .img-modal{
    width: 100%;
    border-radius: 25px;
  }
  .news-date{
    font-size: 11pt;
    font-weight: bold;
  }
  .crop{
    width:297px;
    height:300px;
    overflow: hidden;
    border-radius: 50%;
    margin-bottom: 50px;
  }
  
  .crop img{
    width:400px;
    margin: -20px 0 0 -22px;
  }
  .image-news-detail{
    width: 100%;
    height: 100%;
    margin-top: -50px;
  }
  
  .dropdown {
    position: relative;
    display: inline-block;
  }
  
  .dropdown-content {
    display: none;
    position: absolute;
    background-color: #f1f1f1;
    min-width: 170px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
    border-radius: 10px;
  }
  
  .dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    border-radius: 10px;
  }
  
  .dropdown-content a:hover {background-color: #ddd;}
  
  .dropdown:hover .dropdown-content {display: block;}
  
  .dropdown:hover .dropbtn {color: yellow;}
  
  
  
  .title-favorite{
    font-size: 44px; 
    margin-bottom:30px
  }
  .title-are-you{
    font-size: 54px; 
    margin-bottom:30px
  }
  .img-store{
    width: 100%;
    height: 100%;
  }
  .img-career{
    height: 450px;
  }
  .containerimage-news {
    position: relative;
    text-align: center;
    color: white;
    /* height: 245px; */
  }
  
  .containerimage-news-page {
    position: relative;
    text-align: center;
    color: white;
    height: 245px;
  }
  
  .page-history{
    margin-bottom: 45px;;
  }
  .sub-title-contact-us {
    font-size: 24pt;
    font-weight: bold;
    line-height: normal;
  }
  
  .sub-title-about-us {
    font-size: 18pt;
    font-weight: bold;
  }
  
  .sub-title-2-about-us {
    font-size: 17pt;
    font-weight: bold;
  }
  
  .sub-title-about-us-m {
    font-size: 14pt;
    font-weight: bold;
  }
  
  .sub-title-about-us-m-kudus {
    font-size: 13pt;
    font-weight: bold;
  }
  
  .sub-title-2-about-us-m-kudus {
    font-size: 13pt;
    font-weight: bold;
  }
  
  .sub-title-2-about-us-m {
    font-size: 14pt;
    font-weight: bold;
  }
  
  .container-add{
    margin-left: 200px;
    margin-right: 200px;
  }
  
  .padding-0{
    padding: 0;
  }
  
  .img-history{
    /* width: 100%; */
    height: 400px;
  }
  
  .navbar-top.sticky-top{
    top: -1;
  }
  /* .bg-title-card{
    z-index: 100;
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 180px;
      height: 40px;
      background-color: yellow;
      border-top-right-radius: 15px;
  } */
  .title-card{
    z-index: 100;
    position: absolute;
    padding-bottom: 4px;
    padding-left: 16px;
    padding-right: 20px;
    padding-top: 4px;
    bottom: 0px;
    left: 0px;
    border-top-right-radius: 15px;
  }
  
  .bg-blue-light{
    background-color: #00A6E8;
  }
  
  .bg-yellow{
    background-color: #FFCA02;
  }
  
  .bg-red{
    background-color: red;
  }
  
  .divider-about-us{
    margin-top: 100px;
    margin-bottom: 100px;
  }
  
  .divider-business{
    margin-top: 100px;
    margin-bottom: 100px;
  }
  
  .img-news{
    max-height: 245px;
    /* max-height: 100%; */
    max-width: 100%;
  }
  
  .img-news-page{
    border-radius: 20px;
    max-width: auto;
    /* width: 100%; */
    height: 100%;
  }
  
   /* FONT  */
   /* cyrillic-ext */
  @font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(https://fonts.gstatic.com/s/roboto/v30/KFOmCnqEu92Fr1Mu72xKOzY.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
  }
  /* cyrillic */
  @font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(https://fonts.gstatic.com/s/roboto/v30/KFOmCnqEu92Fr1Mu5mxKOzY.woff2) format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
  }
  /* greek-ext */
  @font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(https://fonts.gstatic.com/s/roboto/v30/KFOmCnqEu92Fr1Mu7mxKOzY.woff2) format('woff2');
    unicode-range: U+1F00-1FFF;
  }
  /* greek */
  @font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(https://fonts.gstatic.com/s/roboto/v30/KFOmCnqEu92Fr1Mu4WxKOzY.woff2) format('woff2');
    unicode-range: U+0370-03FF;
  }
  /* vietnamese */
  @font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(https://fonts.gstatic.com/s/roboto/v30/KFOmCnqEu92Fr1Mu7WxKOzY.woff2) format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
  }
  /* latin-ext */
  @font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(https://fonts.gstatic.com/s/roboto/v30/KFOmCnqEu92Fr1Mu7GxKOzY.woff2) format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
  }
  
    .back-blue {
      background-color: #003F86;
    }
  
  
    .top-banner {
      /* max-height: 700px; */
      width: 100%;
      /* object-fit: cover; */
    }
  
    .carousel-control-next-icon.our {
      background-image: url('../images/icons/arrow_right_green.png');
    }
  
    .carousel-control-prev-icon.our {
      background-image: url('../images/icons/arrow_left_green.png');
    }
  
    .carousel-control-next-icon.banner {
      background-image: url('../images/icons/arrow_right_white.png');
    }
  
    .carousel-control-prev-icon.banner {
      background-image: url('../images/icons/arrow_left_white.png');
    }
  
    .custom-toggler .navbar-toggler-icon {
      background-image: url('../images/icons/white_menu.png')
        /* background-image: url(
  "data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 128, 0, 0.8)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E"); */
    }
    .vertical-center {
      margin: 0;
      position: absolute;
      top: 50%;
      -ms-transform: translateY(-50%);
      transform: translateY(-50%);
    }
  
    .m-top{
      margin-top: 50px;
    }
  
    .our-history{
      margin-left: 130px;
      margin-right: 130px;
    }
  
    .email-yellow{
      text-decoration: underline;
      color: #e3b402;
    }
  
    .divider{
      margin-top: 100px;
      margin-bottom: 100px;
    }
  
    .pad-left-about-us{
      /* padding-left: 300px; */
      padding-left: 250px;
    }
  
    .pad-right-about-us{
      padding-right: 250px;
      /* padding-right: 300px; */
    }
  
    .pad-left-savoria-store{
      padding-left: 210px;
    }
  
    .pad-right-savoria-store{
      padding-right: 210px;
    }
  
    .pad-left-about-us-our{
      padding-left: 220px;
    }
  
    .pad-right-about-us-our{
      padding-right: 220px;
    }
  
    .pad-left{
      padding-left: 108px;
    }
  
    .pad-right{
      padding-right: 108px;
    }
  
    .img-cert-cikupa{
      max-height: 112px;
    }
  
    .img-cert-bogor{
      max-height: 130px;
    }
  
    .img-cert-kudus{
      max-height: 70px;
    }
  
    .img-care {
      /* width: 60%; */
      height: 360px;
    }
  
    .sub-title {
      font-weight: bold;
      font-size: 25pt;
      /* font-size: 36pt; */
      line-height: normal;
    }

    .sub-title-career {
      font-weight: bold;
      font-size: 24pt;
      /* font-size: 36pt; */
      line-height: normal;
    }

    .sub-title-business-opportunity {
      font-weight: bold;
      font-size: 25pt;
      /* font-size: 36pt; */
      line-height: normal;
    }

    /* .sub-title-its-all {
      font-weight: bold;
      font-size: 33pt;
      line-height: normal;
    } */

    .title-sub-text {
      font-size: 22pt;
    }

    .sub-text {
      font-size: 12pt;
    }

    .sub-text-production-facility {
      font-size: 12pt;
    }
    .sub-text-business-opportunity{
      font-size: 14pt;
    }

    .sub-text-vision {
      font-size: 24pt;
      font-weight: bold;
    }
  
    body {
      min-height: 800px;
    }
  
    /* about us */
    .about-us-banner {
      background-image: url('../images/slices/about_us.jpg');
      background-repeat: no-repeat;
      background-size: 100% 60%;
    }
  
    .search__input {
      width: 100%;
      padding: 0px 12px;
      background-color: transparent;
      transition: transform 250ms ease-in-out;
      font-size: 14px;
      line-height: 18px;
      color: #EE3727;
      background-image: url('../images/icons/search-red.png');
      background-repeat: no-repeat;
      background-size: 18px 18px;
      background-position: 95% center;
      border-radius: 50px;
      border: 1px solid #EE3727;
      transition: all 250ms ease-in-out;
      backface-visibility: hidden;
      transform-style: preserve-3d;
      margin-left: 15px;
    }
  
    .search__input::placeholder {
      /* Chrome, Firefox, Opera, Safari 10.1+ */
      color: #EE3727;
      opacity: 1;
      /* Firefox */
    }
  
    .search__input:-ms-input-placeholder {
      /* Internet Explorer 10-11 */
      color: #EE3727;
    }
  
    .search__input::-ms-input-placeholder {
      /* Microsoft Edge */
      color: #EE3727;
    }
  
    .search__input:focus {
      outline: none !important;
      border: 1px solid #EE3727;
    }
  
    .end-nav {
      margin-right: 30px;
    }
  
    .img-lang {
      width: 35px;
      height: 35px;
    }
  
    .img-lang-contain {
      margin-left: 10px;
      margin-right: 10px;
    }
  
    .savoria-logo-top.mobile {
      width: 90px;
      margin-right: 30px;
      margin-left: 30px;
    }
  
    .savoria-logo-top {
      width: 120px;
      margin-right: 25px;
      margin-left: 25px;
    }

    .savoria-logo-footer {
      width: 120px;
      margin-right: 25px;
      margin-left: 25px;
    }
  
    .back-logo {
      background-color: white;
      border-top-right-radius: 50rem;
      border-bottom-right-radius: 50rem;
      height: 105px;
      margin-right: 30px;
    }
  
    nav.navbar-top {
      /* background-color: #003F86; */
      color: white;
      height: 55px;
      padding-top: 0rem;
      padding-bottom: 0rem;
      /* position: absolute; */
    }

    a.nav-link {
      color: rgb(161, 161, 161);
      border-bottom: 1px solid rgb(161, 161, 161);
    }
    a.nav-link:hover::before {
      transition: 0.5s;
      background-image: url('../images/icons/arrow-right-menu-red.png');
      background-size: 13px 13px;
      display: inline-block;
      width: 13px; 
      height: 13px;
      margin-right: 3px;
      content:"";
    }
    a.nav-link.active::before {
      transition: 0.5s;
      background-image: url('../images/icons/arrow-right-menu-red.png');
      background-size: 13px 13px;
      display: inline-block;
      width: 13px; 
      height: 13px;
      margin-right: 3px;
      content:"";
    }
    .nav-link.active,
    .show>.nav-link {
      color: #EE3727;
      /* font-weight: bold; */
      scale: 1.1;
      margin-left: 20px;
      transition: transform .5s ease;
      border-bottom: 1px solid #EE3727;
    }
  
    .nav-active{
      color: #EE3727;
      border-bottom: 1px solid #EE3727;
    }
  
    .nav-link:hover {
      color:  #EE3727;
      /* font-weight: bold; */
      scale: 1.1;
      margin-left: 20px;
      transition: transform .5s ease;
      border-bottom: 1px solid #EE3727;
    }
  
    .footer-red {
      background-color: #EE3727;
      color: white;
    }
  
    /* business */
  
    .img-international {
      background-size: cover;
    }
  
    .d-flex.business-content.collapsed>div.business-arrow {
      display: block;
    }
  
    .d-flex.business-content>div.business-arrow {
      display: none;
    }
  
    .business-arrow {
      color: #B3B3B3;
    }
  
    .business-arrow:hover {
      cursor: pointer;
    }
  
    .tb {
      margin-bottom: 15px;
    }
  
    .business-content.sav-collapse:hover {
      cursor: pointer;
    }
  
    .nav-item.our>.nav-link.active{
      color: #68CAE9;
      font-weight: bold;
      background-color: #fff;
      border: 0;
    }
  
    .nav-item.our>.nav-link{
      color: black;
      font-weight: bold;
      background-color: #fff;
      border: 0;
    }
    .nav-item.our>.nav-link:hover{
      color: #68CAE9;
      font-weight: bold;
      background-color: #fff;
      border: 0;
    }
  
    .business-content {
      margin-top: 50px;
      margin-bottom: 40px;
    }
  
    .title-page-about-us {
      margin-top: 40px;
      margin-bottom: 40px;
    }
    
    .rounded-left{
      border-top-left-radius: 50rem;
      border-bottom-left-radius: 50rem;
    }
  
    .rounded-right{
      border-top-right-radius: 50rem;
      border-bottom-right-radius: 50rem;
    }
  
    .our-brand-banner {
      background-image: url('../images/slices/desktop/Asset 27@4x-100.jpg');
      background-repeat: no-repeat;
      background-size: cover;
      height: 350px;
    }
  
    .business-banner {
      background-image: url('../images/slices/desktop/Asset 81@4x-8.png');
      background-repeat: no-repeat;
      background-size: cover;
      height: 350px;
    }
  
    .career-banner {
      background-image: url('../images/slices/desktop/career-banner.png');
      background-repeat: no-repeat;
      background-size: cover;
      height: 350px;
    }
  
    .news-banner {
      background-image: url('../images/slices/desktop/news-banner.png');
      background-repeat: no-repeat;
      background-size: cover;
      height: 350px;
    }
  
    .store-banner {
      background-image: url('../images/slices/desktop/store-banner.png');
      background-repeat: no-repeat;
      background-size: cover;
      height: 350px;
    }
  
    .contact-us-banner {
      background-image: url('../images/slices/desktop/contact-us-banner.png');
      background-repeat: no-repeat;
      background-size: cover;
      height: 350px;
    }
  
    /* home */
    .our-product-container {
      max-width: 1519px;
    }
  
    .company-contact {
      background-image: url('../images/slices/company_red.jpg');
      background-repeat: no-repeat;
      background-size: cover;
      height: 270px;
    }
  
    .news-value {
      word-wrap: break-word;
      white-space: normal;
      overflow: hidden;
      display: -webkit-box;
      text-overflow: ellipsis;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 4;
      margin-bottom: 3rem;
    }
  
    .news-title {
      align-self: flex-start;
      word-wrap: break-word;
      white-space: normal;
      overflow: hidden;
      display: -webkit-box;
      text-overflow: ellipsis;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 1;
    }
  
    .rounded-news{
      border-radius: 22px;
    }
  
    .contain-news {
      margin-left: 20px;
      margin-right: 20px;
    }
  
    .news-articles {
      /* background-image: url('../images/slices/news_articles.jpg'); */
      /* background-repeat: no-repeat;
      background-size: 100% 300px; */
      margin-bottom: 0px;
    }
  
    img.logo-slide {
      transition: transform .5s ease;
    }
  
    .logo-our {
      max-width: 200px;
      margin-left: 30px;
      margin-right: 30px;
      margin-top: 15px;
      margin-bottom: 15px;
      max-height: 200px;
    }
  
    .logo-slide {
      max-width: 260px;
      margin-left: 10px;
      margin-right: 10px;
      margin-top: 15px;
      margin-bottom: 15px;
      /* height: fit-content; */
      max-height: 150px;
    }
  
    .logo-slide:hover {
        transform: scale(1.1); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
        -webkit-transform: scale(1.1);
    }
  
    .text-grey-sav {
      color: #979797;
    }

    .text-dark-grey-sav {
      color: #585858;
    }
  
    p {
      color: #979797;
      line-height: 2;
    }
  
    section {
      min-height: 150px;
      /* margin-bottom: 30px;
      margin-top: 30px; */
      padding-bottom: 30px;
      padding-top: 30px;
    }
  
    section.about-us {
      min-height: 150px;
      margin-bottom: 70px;
      margin-top: 30px;
    }
  
    section.news {
      min-height: 150px;
      margin-bottom: 70px;
      margin-top: 60px;
    }
  
    section.contact-us {
      min-height: 150px;
      margin-bottom: 70px;
      margin-top: 60px;
    }
  
    .btn-contact:hover {
      background-image: linear-gradient(#FCB90D, #FCB90D);
      padding-left: 30px;
      padding-right: 30px;
      color: white;
      font-weight: bold;
      border-radius: 26px;
    }
  
    .btn-contact {
      background-image: linear-gradient(#FCB90D, #FCB90D);
      padding-left: 30px;
      padding-right: 30px;
      color: #003F86;
      font-weight: bold;
      border-radius: 26px;
    }
  
    .btn-bluesav:hover {
      background-image: linear-gradient(#68DFE9, #68CAE9);
      padding-left: 30px;
      padding-right: 30px;
      color: white;
      font-weight: bold;
      border-radius: 26px;
      box-shadow: 1px 1px #979797;
    }
  
    .btn-bluesav {
      background-image: linear-gradient(#68DFE9, #68CAE9);
      padding-left: 30px;
      padding-right: 30px;
      color: #003F86;
      font-weight: bold;
      border-radius: 26px;
    }

    .btn-send:hover {
      /* background-image: linear-gradient(#C02329, #6b7071); */
      /* background-image: linear-gradient(#C02329, #6b7071); */
      background-color: #E9E1DF;
      padding-left: 30px;
      padding-right: 30px;
      color: #C02329;
      font-weight: bold;
      border-radius: 26px;
      border-color: #E9E1DF;
      transform: scale(1.1);
    }

    .btn-send {
      /* background-image: linear-gradient(#C02329, #6b7071); */
      /* background-image: linear-gradient(#C02329, #6b7071); */
      background-color: #C02329;
      padding-left: 30px;
      padding-right: 30px;
      color: #ffffff;
      font-weight: bold;
      border-radius: 26px;
      /* scale: 1.2; */
    }

    .btn-submit:hover {
      /* background-image: linear-gradient(#C02329, #6b7071); */
      /* background-image: linear-gradient(#C02329, #6b7071); */
      background-color: #E9E1DF;
      padding-left: 0.75rem;
      padding-right: 0.75rem;
      color: #EE3727;
      font-weight: bold;
      border-radius: 26px;
      border-color: #E9E1DF;
    }

    .btn-submit {
      /* background-image: linear-gradient(#C02329, #6b7071); */
      /* background-image: linear-gradient(#C02329, #6b7071); */
      background-color: #EE3727;
      padding-top: 0.75rem;
      padding-bottom: 0.75rem;
      color: #ffffff;
      /* font-weight: bold; */
      border-radius: 26px;
      /* scale: 1.2; */
      width: 100%;
    }

    .btn-upload {
      background-color: #7C7C7C;
      padding-top: 0.75rem;
      padding-bottom: 0.75rem;
      color: #ffffff;
      /* font-weight: bold; */
      border-radius: 26px;
      width: 100%;
      /* scale: 1.2; */
    }

    .btn-upload:hover {
      background-color: #7C7C7C;
      padding-top: 0.75rem;
      padding-bottom: 0.75rem;
      color: #ffffff;
      font-weight: bold;
      border-radius: 26px;
      width: 100%;
      /* scale: 1.2; */
    }
  
    .btn-learn:hover {
      background-image: linear-gradient(#68DFE9, #68CAE9);
      padding-left: 30px;
      padding-right: 30px;
      color: white;
      font-weight: bold;
      border-radius: 26px;
    }
  
    .btn-learn {
      background-image: linear-gradient(#68DFE9, #68CAE9);
      padding-left: 30px;
      padding-right: 30px;
      color: #003F86;
      font-weight: bold;
      border-radius: 26px;
    }
  
    .carousel-indicators.banner-mobile>button {
      border-radius: 100%;
    }
  
    .carousel-indicators.banner {
      /* justify-content: flex-start; */
    }
  
    .carousel-indicators.banner>button {
      border-radius: 100%;
    }
  
    .carousel-indicators [data-bs-target] {
      width: 10px;
      height: 10px;
    }
  
    /* FONT FAMILI */
    .family-kr {
      font-family: KR;
    }
  
    .family-reb {
      font-family: REB;
    }
  
    .family-kl {
      font-family: KL;
    }
  
    .family-rsb {
      font-family: RSB;
    }
  
    .family-km {
      font-family: KM;
    }
  
    /* TITLE */
    .title-banner {
      font-size: 54px;
      font-weight: bold;
    }
  
    .title-address {
      font-size: 19pt;
      font-weight: bold;
    }
  
    .title {
      font-size: 25pt;
      font-weight: bold;
    }

    .title-home {
      font-size: 25pt;
      font-weight: bold;
    }

    .title-home-s5 {
      font-size: 25pt;
      font-weight: bold;
      text-shadow: 1px 1px 1px #00000068;
    }

    .title-recruitment {
      font-size: 40pt;
      font-weight: bold;
    }

    .title-hero {
      font-size: 60pt;
      font-weight: bold;
      /* text-shadow: black 2px 0 2px; */
      text-shadow: 0 0 15px #585757;
    }
  
  
    .title-business {
      font-size: 21pt;
      font-weight: bold;
    }
    .title-sub-glance {
      font-size: 20pt;
      font-weight: bold;
    }
  
    .news-readmore{
      font-size: 12pt;
      font-weight: bold;
    }
  
    .news-text-content{
      font-size: 10pt;
    }
  
    /* FONT COLOR */
    .font-blue-light{
      color : #00A6E8;
    }
    .font-grey{
      color: #404040;
    }
  
    .font-red {
      color: #C02329;
    }
  
    .font-green-light {
      color: #92C000;
    }
  
    .font-blue {
      color: #003F86;
    }
  
    .font-green {
      color: #007942;
    }
  
    .font-yellow {
      color: #FFC100;
    }
  
    .content-glance {
      padding: 30px 80px 30px 80px;
    }
  
    .about-savoria {
      /* background-image: url('../images/slices/asset_about.jpg'); */
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
      min-height: 400px;
      padding: 30px;
    }
    
    .bg-glance{
      background-image: url('../images/slices/desktop/Asset 12@4x-100.jpg');
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
      min-height: 400px;
    }
  
    .bg-visi{
      background-image: url('../images/slices/desktop/Asset 16@4x-100.jpg');
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
      min-height: 100px;
    }
    .bg-values{
      background-image: url('../images/slices/desktop/Asset 17@4x-100.jpg');
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
      min-height: 100px;
    }
    .bg-our{
      background-image: url('../images/slices/desktop/Asset 18@4x-100.jpg');
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
      min-height: 100px;
    }
    .bg-pf{
      background-image: url('../images/slices/desktop/Asset 19@4x-100.jpg');
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
      min-height: 100px;
    }
  
    footer {
      background-color: #003F86;
      color: white;
    }
  
    .offcanvas-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 0rem 0rem;
    }
  
    .offcanvas-header .btn-close {
      padding: 0.5rem 0.5rem;
      margin-top: -0.5rem;
      margin-right: 0rem;
      margin-bottom: -0.5rem;
    }
  
    .btn-close {
      width: 3em;
      height: 1em;
      background-image: url('../images/icons/icon_close.png');
      background-size: contain;
      opacity: 1;
    }
  
    .nav-tabs .nav-link {
      color: #00A6E8;
      background-color: #fff;
      border: 0;
    }
  
    .nav-tabs .nav-link.active {
      color: #FFCA02;
      font-weight: bold;
      background-color: #fff;
      border: 0;
    }
    .nav-tabs .nav-link:hover {
      color: #FFCA02;
      background-color: #fff;
      font-weight: bold;
      border: 0;
    }
  
    .year{
      font-size: 55pt;
      font-weight: bold;
    }
  
    .nav-tabs{
      border: 0;
    }
  
    .nav-link.our-page{
      color: black;
      font-weight: bold;
    }

  .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #D22737;
    opacity: 0;
    transition: opacity 0.3s ease;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }

  .text-overlay {
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%);
          color: white; /* Text color */
          padding: 10px; /* Adjust the padding as needed */
          text-align: center;
      }

  .container-img-two:hover .overlay {
    opacity: 0.9;
    cursor: pointer;
  }
  
  @media only screen and (max-width: 1286px) {
    .img-olshop{
      max-height: 45px;
    }
    /* .pagination-vertical-news{
      position: inherit;
      margin-top: 0px;
      padding-top: 32px;
    } */
    .home-latest-news{
      padding-top: 0.5rem;
    }

    .logo-slide {
      max-width: 200px;
      margin-left: 10px;
      margin-right: 10px;
      margin-top: 15px;
      margin-bottom: 15px;
      max-height: 120px;
      object-fit: contain;
    }
  }
  
  @media only screen and (max-width: 1251px) {
    .pad-left-savoria-store{
      padding-left: 120px;
    }
  
    .pad-right-savoria-store{
      padding-right: 120px;
    }
  
    .pad-left-about-us{
      padding-left: 120px;
    }
  
    .pad-right-about-us{
      padding-right: 120px;
    }
    .img-olshop{
      max-height: 45px;
    }
  }
  
  @media only screen and (max-width: 1108px) {
    .pad-left-about-us-our{
      padding-left: 130px;
    }
  
    .pad-right-about-us-our{
      padding-right: 130px;
    }
    .img-olshop{
      max-height: 45px;
    }
  }
  
  @media only screen and (max-width: 1074px) {
    .pad-left-savoria-store{
      padding-left: 180px;
    }
  
    .pad-right-savoria-store{
      padding-right: 180px;
    }
    .pad-left-about-us{
      padding-left: 180px;
    }
  
    .img-olshop{
      max-height: 40px;
    }
  
    .pad-right-about-us{
      padding-right: 180px;
    }
  
    .pad-left-about-us-our{
      padding-left: 85px;
    }
  
    .pad-right-about-us-our{
      padding-right: 85px;
    }
  }