.section1 {
  min-height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}
.section2 {
  height: 200vh;
  display: flex;
  justify-content: center;
  align-items: center;
}
.section3 {
  min-height: 300vh;
  display: flex;
  justify-content: center;
  align-items: center;
}

/*-------------------- DOT NAV -------------------*/
.dot-navigation {
    position: fixed;
    top: 50%;
    left: 10px; /* Align dots to the left */
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    gap: 3vh;
    align-items: center;
    background-color: transparent;
	z-index: 9000002!important;
}
@media only screen and (max-width: 640px) {
	.dot-navigation {
    display: none;
	}
}

.dot-wrapper {
    position: relative;
    width: 40px; /* Increase hit area size */
    height: 40px; /* Increase hit area size */
    cursor: pointer; /* Make the entire area clickable */
}

.dot {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 10px; /* Small dot size */
    height: 10px; /* Small dot size */
    border-radius: 50%;
    background-color: #ffd47e; /* Ensure active color is applied */
    box-shadow: 0 0 10px #e16819, 0 0 15px #e16819, 0 0 20px #e16819;
    transition: background-color 0.3s;
}

.label {
    position: absolute;
    top: 50%;
    left: 50px; /* Position hover text on the right */
    transform: translateY(-50%);
    background-color: transparent;
    opacity: 0;
    font-size: 30px; /* Adjust font size if needed */
    text-align: left; /* Align text to the left */
    white-space: nowrap;
    pointer-events: none; /* Disable pointer events for the label */
	font-family: "BadaBoom BB";
	color: #ffd47e;
   text-shadow: 0 0 5px #e16819, 0 0 7px #e16819, 0 0 10px #e16819 !important;
	-webkit-animation: glow 1s ease-in-out infinite alternate;
	-moz-animation: glow 1s ease-in-out infinite alternate;
	animation: glow 1s ease-in-out infinite alternate;
}

.dot-wrapper.active .dot {
	background-color: #abfcf8;
    box-shadow: 0 0 10px #007eff, 0 0 15px #007eff, 0 0 20px #007eff;
}

.overlay {
    height: 100vh;
    width: 0;
    position: fixed; /* Stay in place */
    left: 0;
    top: 0vh;
    background-color: transparent; /* Black fallback color */
    overflow-x: hidden; /* Disable horizontal scroll */
    display: flex;
    align-items: center;
}

.overlay-content {
    position: absolute;
    width: 100%; /* 100% width */
    height: 100%;
    text-align: center; /* Centered text/links */
    margin: auto; /* 30px top margin to avoid conflict with the close button on smaller screens */
    background-color: transparent;
    top: 0;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    opacity: 0;
}

.overlay-content-txt {
    display: block;
}

.nav_txt {
    height: 400px;
    text-align: center;
    position: relative;
    margin: auto;
}

.nav_txt a {
    text-decoration: none;
    font-size: 23px;
    color: #818181;
}
/*-------------------- DOT NAV END -------------------*/


#myNav {
	top:0;
	right: 0;
	position: fixed;
	z-index: 2147483650!important; /* Sit on top */
	width:100%;
	height:0%;
	overflow: hidden;
	
}

.nav_cont {
	position: fixed;
	top:33vh;
	left:0;
	z-index: 2147483650!important; /* Sit on top */
	width:100%;
	height:100%;
	overflow: visible;
}


/* The Overlay (background) */
.overlay {  
	height: 100vh;
	width: 0;
	position: fixed; /* Stay in place */
	left: 0;
	top: 0vh;
	background-color: transparent; /* Black fallback color */
	overflow-x: hidden; /* Disable horizontal scroll */
	display: flex;
	align-items: center;
}

/* Position the content inside the overlay */
.overlay-content {
	position: absolute;
	width: 100%; /* 100% width */
	height:100%;
	text-align: center; /* Centered text/links */
	margin: auto; /* 30px top margin to avoid conflict with the close button on smaller screens */
	background-color: transparent;
	top:0;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
	opacity: 0;
	
}
.glow_nav{

	 box-shadow: 0 0 20px #ff0000, 0 0 10px #ff0000, 0 0 15px #ff0000, 0 0 20px #ff0000, 0 0 25px #ff0000, 0 0 30px #ff0000, 0 0 35px #ff0000;
}


.overlay-content-txt{
 	display: block;

}

.nav_txt{
	height: 400px;
	text-align: center;
	position: relative;
	margin: auto;
}

.nav_txt_1, .nav_txt_2, .nav_txt_3, .nav_txt_4, .nav_txt_5, .nav_txt_6, .nav_txt_7{
	padding-bottom: 15px;
}

.nav_txt_1 a, .nav_txt_2 a, .nav_txt_3 a, .nav_txt_4 a, .nav_txt_5 a, .nav_txt_6 a, .nav_txt_7 a{
  text-decoration: none;
  font-size: 23px;
  color: #818181;

}

.burger  {
	display: block;
	position: fixed;
	overflow: hidden;
	margin: 0;
	padding: 0;
	width: 50px;
	height: 50px;
	font-size: 0;
	text-indent: -9999px;
	appearance: none;
	border-radius: none;
	border: none;
	cursor: pointer;
	transition: background 0.3s;
	top:0px;
	left:5px;
	z-index: 2147483650;
}

.burger:focus  {
  outline: none;
}

.burger span {
  display: block;
  position: absolute;
  top: 25px;
  left: 10px;
  right: 10px;
  height: 2px;
}

.burger span::before,
.burger span::after {
	position: absolute;
	display: block;
	left: 0;
	width: 100%;
	height: 2px;
	content: "";
	background: #abfcf8;
	box-shadow: 0 0 10px #007eff, 0 0 15px #007eff, 0 0 20px #007eff;

}

.burger  span::before {
  top: -5px;	
}

.burger.is-active span, .burger.is-active  span::before, .burger.is-active  span::after {	
}

.burger span::after {
  bottom: -5px;	
}

.burger {
  background-color: transparent;
}

.burger span {
  transition: background 0s 0.3s;
}

.burger span::before,
.burger span::after {
  transition-duration: 0.3s, 0.3s;
  transition-delay: 0.3s, 0s;
}

.burger span::before {
  transition-property: top, transform;
}

.burger span::after {
  transition-property: bottom, transform;
}

/* active state, i.e. menu open */
.burger.active {
  background-color: transparent;
}

.burger.active span {
  background: none;
}

.burger.active span::before {
  top: 0;
  transform: rotate(45deg);
}

.burger.active span::after {
  bottom: 0;
  transform: rotate(-45deg);
}

.burger.active span::before,
.burger.active span::after {
  transition-delay: 0s, 0.3s;
}




/* BARBA TRANSITIONS */
.nav_cover {
	top:0px;
	position: absolute;
	background-color: transparent;
	width:100%;
	height:55px;
	margin: auto;
	opacity: 1;
	text-align: center;
}
.nav_cover_line {
	top:0;
	left:0;
	right:0;
	position:absolute;
	background-color: transparent;
	width:100%;
	height:100%;
	margin: auto;
	opacity: 1;
	/*transform: rotate(-5deg);*/
	
	background-image: url("../images/home/nav_cover.png");
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;

	
}


.footer-basic-right {
	text-align: right;
	color:#878e98;
	max-width: 60%;
	text-decoration:none;
	font-weight:400;
	font-size:12px;
	bottom:38px;
	right:30px;
	position:absolute;
}

.arrows {
	width: 32px;
	height: 32px;
	position: absolute;
	bottom: 10px;
}

.arrows path {
	stroke: #ffd47e;
	fill: transparent;
	stroke-width: 1.5px;	
	 box-shadow: 0 20px 50px #e16819, 0 20px 50px #e16819, 0 0 50px #e16819;
	-webkit-animation: glow 1s ease-in-out infinite alternate;
	-moz-animation: glow 1s ease-in-out infinite alternate;
	animation: glow 1s ease-in-out infinite alternate;
	animation: arrow 2s infinite;
	-webkit-animation: arrow 2s infinite;
	transition: background-color 0.3s;
	
}

@keyframes arrow
{
0% {opacity:0}
40% {opacity:1}
80% {opacity:0}
100% {opacity:0}
}

@-webkit-keyframes arrow /*Safari and Chrome*/
{
0% {opacity:0}
40% {opacity:1}
80% {opacity:0}
100% {opacity:0}
}

.arrows path.a1 {
	animation-delay:-1s;
	-webkit-animation-delay:-1s; /* Safari 和 Chrome */
}

.arrows path.a2 {
	animation-delay:-0.5s;
	-webkit-animation-delay:-0.5s; /* Safari 和 Chrome */
}

.arrows path.a3 {	
	animation-delay:0s;
	-webkit-animation-delay:0s; /* Safari 和 Chrome */
}
/*----- CTA --------------*/