body {
		background-color: white;
		font-family: halcom, sans-serif;
		min-height: 100vh;
		overflow-x: hidden;
		font-size: 18px;
	}

	h2 {
		font-size: 75px;
		line-height: 100%;
		font-weight: 600;
	}

	h3 {
		font-size: 25px;
		font-weight: 600;
	}

	h4 {
		font-size: 40px;
		font-weight: 600;
	}
    @media (max-width: 530px){
        body{
            font-size: 16px;    
        }
        h2{
    		font-size: 48px;
    		line-height: 100%;
    		font-weight: 600;
	    } 
    }
	.blueColor {
		color: #0a2846;
	}

	.caviarColor {
		color: #ae9a63;
	}

	.whiteColor {
		color: #ffffff;
	}

	.yellowColor,
	.locationSquareName {
		color: #ffdc00;
	}
	
 .carousel-item p a{
     text-decoration: none;
     color: #FFFFFF;
 }
 .carousel-item p a:hover{
     
     color: #eae9e9;
     text-shadow: 1px 1px 2px black;
 }
	/*.navbar {
		position: fixed;
		top: 0;
		left: 0;
		transition: top 0.5s ease-in-out;
		height: 50px;
		width: 100%;
		background-color: cornsilk;

	}

	.navbar.hide {
		top: -50px
	}*/
	#nav-scroll {
		position: fixed;
		top: 0;
		left: 0;
		transition: top 0.5s ease-in-out;
		height: 50px;
		width: 100%;
	}

	.main-nav {
		height: 80px;
		background-color: #ffffff;
	}

	.main-nav .navbar {
		max-width: 960px;
	}

	.page-section-container {
		max-width: 100%;
	}

	.nav-section-container {
		max-width: 960px;
		min-height: 100%;
	}

	.content-section-container {
		max-width: 960px;
		min-height: 100%;
	}

	.smart-scroll {
		position: fixed;
		top: 0;
		right: 0;
		left: 0;
		z-index: 1030;
	}

	.scrolled-down {
		transform: translateY(-100%);
		transition: all 0.3s ease-in-out;
	}

	.scrolled-up {
		transform: translateY(0);
		transition: all 0.3s ease-in-out;
	}

	/* home */

	#home {
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
		/*min-height: 100vh;*/
		z-index: 2;
	}

	.homeTitle {
		position: relative;
        max-width: 450px;

	}
	.img-header-gradient{
  position:absolute;
  display:inline-block;
  width: 100%;
  height: 100vh;
}
    .img-header-gradient:after {
  content:'';
  position:absolute;
  left:0; top:0;
  width:100%; height:100vh;
  display:inline-block;
  
  background: linear-gradient(to top, rgba(10, 40, 70, 0.65) 0%,rgba(10, 40, 70, 0) 75%); /* W3C */
  
}

	.rollerscript {
		font-family: rollerscript-rough, sans-serif;
		font-weight: 400;
		font-style: normal;
		font-size: 30px;
	}

	/* our Business */

	#ourBusiness {
		min-height: 100vh;
		background-position: center;
		background-repeat: no-repeat;
		background-size: contain;
		background-color: white;
		background-blend-mode: multiply;
	}

	.ourBusinessText {
		max-width: 602px;
	}
    .impressumText{
        	max-width: 960px;
    }
	.fish {
		width: 100%;
		height: auto;
	}

	#ourBusiness2 {
		color: #ffffff;
		background-color: #0a2846;
		background-position: center left;
		background-repeat: no-repeat;
		background-size: contain;
	}
	@media (max-width: 576px){
	    #ourBusiness2 {
		
		background-position: bottom left;
		padding-bottom: 70% !important;
	}
	} 

	#ourBusiness3 {
		
		background-position: left bottom, center;
		background-repeat: no-repeat, no-repeat;
		background-size: contain, contain;
	}

	.ourBusiness3Text {
		max-width: 560px;
	}

	.ourBusiness3Imgs {
		position: relative;
		max-width: 760px;
	}

	.ourBusiness3Imgs img:first-child {
		position: relative;
		top: 0px;
		left: 0px;
		width: 100%;
		max-width: 496px;
		border: 5px solid white;
	}

	.ourBusiness3Imgs img:first-child::after {
		content: ' ';
		display: table;
		clear: both;
	}

	.ourBusiness3Imgs img:last-child {

		position: relative;
		bottom: 0px;
		right: 0px;
		max-width: 380px;
		border: 5px solid white;
		float: right;
		width: 66%;
		margin-left: -80%;
		margin-top: 165px;
		position: relative;
		z-index: 1;
	}


	/* products */
	.productsFishImgs img:first-child::after {
		content: ' ';
		display: table;
		clear: both;
	}

	.productsFishImgs {
		position: relative;
		max-width: 760px;
	}

	.productsFishImgs img:first-child {
		position: relative;
		top: 0px;
		left: 0px;
		width: 70%;

		margin-left: -20%;

	}

	.productsFishImgs img:last-child {

		position: relative;
		bottom: 0px;
		right: 0px;



		float: right;
		width: 110%;
		margin-right: -30%;
		margin-top: -30%;
		position: relative;
		z-index: 1;
	}


	/* Our Products Tab*/
	#regionTabs {
		color: #ffffff;
		/*min-height: 1062px;*/
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
		padding-top: 5rem;
		padding-bottom: 5rem;

	}

	.tab-content {
		background-color: rgba(255, 255, 255, 0.5);
		border-top-right-radius: .25rem;
		border-bottom-left-radius: .25rem;
		border-bottom-right-radius: .25rem;
		text-shadow: 1px 1px 2px black;

	}

	#regionTabs .nav-tabs .nav-item {
		width: 25%;
		font-size: 20px;
		font-weight: 600;
		line-height: 100%;
	}

	#regionTabs .nav-tabs {
		border: none;
        text-shadow: 1px 1px 2px black;
	}

	#regionTabs .nav-tabs .nav-link {
		background-color: rgba(255, 255, 255, 0.3);
		border: none;
		color: #ffffff;
		margin-right: 1px;
		margin-bottom: 0px;
		height: 60px;
	}

	#regionTabs .nav-tabs .nav-item:last-child .nav-link {
		margin-right: 0px;
	}

	#regionTabs .nav-tabs .nav-link.active {
		background-color: rgba(255, 255, 255, 0.5);
		
	}

	#regionTabs .nav-tabs .nav-link:hover {
		border-top: 1px solid white;
		border-left: 1px solid white;
		border-right: 1px solid white;
		padding-top: -1px;
	}
    #products-carousel-new-zeland{
        min-height: 855px;
    }
    #products-carousel-malaysia{
          min-height: 855px;
    }
	.carousel-control-prev,
	.carousel-control-prev:hover,
	.carousel-control-next,
	.carousel-control-next:hover {
		opacity: 0;
	}

	.carousel-indicators {
		position: relative;
	
		right: 0;

		left: 0;
		z-index: 2;
		display: flex;
		justify-content: center;
		padding: 0;
		margin-right: 0px;
		margin-top: 1rem;
		margin-bottom: 0rem;
		margin-left: 0px;
		list-style: none;
	}

	.carousel-indicators [data-bs-target] {
		box-sizing: content-box;
		flex: 0 1 auto;
		width: 10px;
		height: 10px;
		padding: 0;
		margin-right: 3px;
		margin-left: 3px;
		text-indent: -999px;
		cursor: pointer;
		background-color: #fff;
		background-clip: padding-box;
		border: 0;
		border-top: 10px solid transparent;
		border-bottom: 10px solid transparent;
		opacity: .5;
		transition: opacity .6s ease;
		border-radius: 50%;
	}

	.carousel-indicators .active {
		opacity: 1;
	}
    
    .carousel-item.active button{}
	@media (max-width: 576px) {
        
		#regionTabs .nav-tabs .nav-item {
			width: 45%;
			margin: 1%;
			background-color: none;
			border: none;
			color: #ffffff;
			border-radius: 8px;
			height: 60px;
		}

		#regionTabs .nav-tabs .nav-item:hover {

			background-color: color: #0a2846;
			color: white;
		}

		#regionTabs .nav-tabs .nav-link {
			background-color: rgba(255, 255, 255, 0.5);
			border-radius: 8px;
			color: #4F667A;
		}

		#regionTabs .nav-tabs .nav-link:hover {
			border-top: none;
			border-left: none;
			border-right: none;
			background-color: #0a2846;
			color: white;
		}

		#regionTabs .nav-tabs .nav-link.active {
			border-bottom: 0px;
			background-color: #0a2846;
			color: white;
		}

		.tab-content {
			background-color: transparent;
		}
	}

	/* caviar */
	

	.caviarBox {
		position: relative;
		width: 100%;
	}

	.caviarBox img {
		margin-top: -98px;
	}

	/* catch */
	.img-gradient{
  position:relative;
  display:inline-block;
  width: 100%;
}
    .img-gradient:after {
  content:'';
  position:absolute;
  left:0; top:0;
  width:100%; height:100%;
  display:inline-block;
  
  background: linear-gradient(to bottom, rgba(10, 40, 70, 1) 0%,rgba(10, 40, 70, 0) 20%,rgba(10, 40, 70, 0) 80%,rgba(10, 40, 70, 1) 100%); /* W3C */
  
}
.storyPlayButtonContainer{
    position: absolute;
    bottom: 0px;
    right: 0px;
    left: 0px;
}
.storyPlayButtonContainer a{
    -webkit-appearance:none;
}
.storyPlayButtonContainer a img{
    opacity: 0.7;
    cursor: pointer;
}
.storyPlayButtonContainer a:hover img{
    opacity: 1;
}
.button-pause,.button-play{
    display: none;
}
.carousel-play-pause.pause .button-play{
    display: block;
}
.carousel-play-pause.play .button-pause{
    display: block;
}
.catch-control-buttons{
    height: 50%;
}
	/* team */
	#team img {
		width: 100%;
		height: auto;
		border: 1px solid #0a2846;
		border-radius: 50%;

	}

	/* sustainability */

	#sustainability1 {
		font-size: 40px;
		font-weight: 600;
		height: auto;
		min-height: 100vh;
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
	}
    @media (max-width: 530px){
        #sustainability1 {
		font-size: 25px;
		
	}
    }
	.imgSubTxt {
		font-size: 14px;
		color: #808080;
	}

	/* products */
	.snapperInsert {
		position: relative;
		left: 30%;
		margin-top: -18%;
		width: 120%;
		margin-right: -15%;
	}

	/* boutique */

	#boutique {
		background-color: #0a2846;
		background-position: bottom right;
		background-repeat: no-repeat;
		background-size: 82%;
	}
    @media (min-width: 972px) {
		#boutique {

			background-repeat: no-repeat;
			background-size: 777.6px;
		}
	}
	/* colaianni */
	#colaianni {
		background-position: bottom right;
		background-repeat: no-repeat;
		background-size: 60vw;

	}

	/* footer */
	footer {
		z-index: 0;
		bottom: 0px;
		background-color: #0a2846;
		color: #ffffff;
		width: 100%;
	}

	.locationImg {

		background-image: linear-gradient(white, #0a2846);

	}

	.locationImg img {
		mix-blend-mode: multiply;
	}

	.locationTextWrapper {
		position: absolute;
		z-index: 20;
		bottom: 15%;
		left: 10%;

	}
    
	.locationSquareName,
	.locationSquareLink {
		font-size: 2vw;
		line-height: 105%;
		font-weight: bold;
	}
	.locationImg a .locationSquareLink{
	   color: #FFF; 
	}
@media (max-width: 576px){
    .locationSquareName,
	.locationSquareLink {
		font-size: 1.2rem;
	}
}
	.locationSquareName {
		color: #ffdc00;
	}

	.socialIconRow {
		max-width: 178px;
	}
	
	.carousel-control-prev, .carousel-control-prev:hover,
	.carousel-control-next, .carousel-control-next:hover
	{
	   opacity: 1;
background-color: transparent;
border: none; 
	}
	.footerLink{
	    color:#FFF;
	    text-decoration: none;
	    cursor: pointer;
	}
	.footerLink:hover{
	    color:#FFF;
	    text-decoration: none;
	    color: #ffdc00;
	}

#bannerf {
    position: fixed; /* Membuat elemen mengambang dan tetap di posisi saat di-scroll */
    bottom: 20px;    /* Jarak 20px dari tepi bawah layar */
    right: 20px;     /* Jarak 20px dari tepi kanan layar */
    z-index: 1000;   /* Memastikan widget berada di atas elemen lain */
    /* Anda bisa menyesuaikan jarak di atas */
  }

  #bannerf img {
    /* Sesuaikan ukuran gambar jika diperlukan agar tidak terlalu besar */
    width: 60px; /* Contoh ukuran, sesuaikan dengan desain Anda */
    height: auto;
    border-radius: 50%; /* Jika ingin bentuk tombol bulat */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Efek bayangan agar lebih menonjol */
    transition: transform 0.3s ease-in-out; /* Efek transisi saat hover */
  }

  #bannerf img:hover {
    transform: scale(1.1); /* Efek zoom saat kursor di atas tombol */
  }

#banneremail {
    position: fixed; /* Membuat elemen mengambang dan tetap di posisi saat di-scroll */
    bottom: 20px;    /* Jarak 20px dari tepi bawah layar */
    right: 100px;     /* Jarak 20px dari tepi kanan layar */
    z-index: 1000;   /* Memastikan widget berada di atas elemen lain */
    /* Anda bisa menyesuaikan jarak di atas */
  }

  #banneremail img {
    /* Sesuaikan ukuran gambar jika diperlukan agar tidak terlalu besar */
    width: 60px; /* Contoh ukuran, sesuaikan dengan desain Anda */
    height: auto;
    border-radius: 20%; /* Jika ingin bentuk tombol bulat */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Efek bayangan agar lebih menonjol */
    transition: transform 0.3s ease-in-out; /* Efek transisi saat hover */
  }

  #banneremail img:hover {
    transform: scale(1.1); /* Efek zoom saat kursor di atas tombol */
  }


.section-bg {
  background: url('../images/bg-parallax.jpg') no-repeat center center;
  /*background: url('../images/Header.jpg') no-repeat center center;*/
  background-size: cover;
  background-attachment: fixed;
  min-height: 420px; /* Ubah sesuai kebutuhan */
  position: relative;
}

.section-bg::before {
  content: '';
  position: absolute;
  inset: 0;
  background-color: rgba(0, 128, 128, 0.7); /* overlay hijau transparan */
  z-index: 0;
}

.section-bg > .container {
  position: relative;
  z-index: 1;
}

.bg-purple-overlay {
  /*background-color: rgba(128, 0, 128, 0.6); /* ungu transparan */*/
}


.zoom-hover {
  transition: transform 0.3s ease;
}

.zoom-hover:hover {
  cursor: pointer;
  transform: scale(1.1);
}