@charset "utf-8";
/* CSS Document */
.main-header {
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	padding: 30px 4vw;
	z-index: 999;
	transition: 0.4s ease-out;
}
 .main-header a {
	 text-decoration: none;
}
 .main-header .nav-links {
	 display: flex;
	 list-style: none;
}
.main-header li {
	display: inline-block;
	margin-right: 50px;
}
.main-header li:last-child {
	margin-right: 0;
}
.main-header .nav-links .nav-link a {
	color: #FFF;
	font-size: 18px;
	font-weight: 400;
	letter-spacing: 0.50px;
	position: relative;
	background: linear-gradient(#d5ff0f, #d5ff0f) left no-repeat, #FFF;
	background-size: 0% 100%;
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	transition: 1s ease-in-out;
}
.main-header li a::after {
	position: absolute;
	content: '';
	background: #d5ff0f;
	left: 0;
	bottom: -10px;
	width: 0%;
	height: 2px;
	transition: 0.4s ease-out;
}
.main-header .nav-links .nav-link a:hover {
	color: #d5ff0f;
	background-size: 100% 100%;
}
.main-header li a:hover::after {
	width: 100%;
}

.main-header .menu-icon {
	position: relative;
	padding: 26px 10px;
	cursor: pointer;
	z-index: 9;
	display: none;
}
 .main-header .menu-icon__line {
	 display: block;
	 position: relative;
	 background: #d5ff0f;
	 height: 2px;
	 width: 20px;
	 border-radius: 4px;
}
 .main-header .menu-icon__line::before, .main-header .menu-icon__line::after {
	 content: '';
	 position: absolute;
	 height: 100%;
	 width: 100%;
	 border-radius: 4px;
	 background: #d5ff0f;
	 transition: background 0.8s ease;
}
 .main-header .menu-icon__line::before {
	 transform: translateY(-5px);
}
 .main-header .menu-icon__line::after {
	 transform: translateY(5px);
}
 .main-header .menu-btn {
	 display: none;
}
.main-header.scrolled {
	position: fixed;
	top: 0;
	z-index: 99;
	background: rgba(0, 0, 0, 0.9);
	padding: 20px 30px;
}
.main-header.scrolled img {
	max-width: 80%;
}
.logo img {
	transition: 0.4s ease-out;
}
 .main-header.scrolled .menu-icon__line, .main-header.scrolled .menu-icon__line::before, .main-header.scrolled .menu-icon__line::after {
	 background: white;
}

/*
.get_btn a {
	font-size: 16px;
	font-weight: 400;
	color: #FFF;
	border: 2px solid #8e8e8e;
	padding: 14px 40px;
	display: inline-block;
	border-radius: 30px;
	transition: 0.4s ease-out;
}
.get_btn a:hover {
	background: #d5ff0f;
	border: 2px solid #d5ff0f;
	color: #000;
}
*/
.get_btn a {
	color: #FFF;
	text-decoration: none;
	display: inline-block;
	text-transform: uppercase;
}
.get_btn a {
	text-decoration: none;
	position: relative;
	overflow: hidden;
	transition: 0.2s;
	transform: scale(1);
	background: #d5ff0f;
	color: #191919;
	font-size: 16px;
	font-weight: 400;
	display: inline-block;
	padding: 14px 50px;
	border-radius: 30px;
	transition: all 0.5s ease;
	border: 1px solid #d5ff0f;
}
.get_btn a span {
	position: relative;
	z-index: 0;
	color: #FFF;
}
.get_btn a .liquid {
	position: absolute;
	top: -70px;
	left: 0;
	width: 100%;
	height: 200px;
	background: #d5ff0f;
	box-shadow: inset 0 0 50px rgba(213, 255,13, 0.9);
	z-index: -1;
	transition: 0.9s;
}
.get_btn a .liquid::after,
.get_btn a .liquid::before {
    position: absolute;
    content: "";
    width: 200%;
    height: 200%;
    top: 0;
    left: 0;
    transform: translate(-25%, -75%);
}
.get_btn a .liquid::after {
	border-radius: 45%;
	background: #000;
	box-shadow: 0 0 10px 5px #000, inset 0 0 5px #000;
	animation: animate 5s linear infinite;
	opacity: 0.8;
}
.get_btn a .liquid::before {
	border-radius: 40%;
	box-shadow: 0 0 10px rgba(213, 255,13, 0.9), inset 0 0 5px rgba(213, 255, 13, 0.9);
	background: #000;
	animation: animate 7s linear infinite;
}
@keyframes animate {
    0% {
        transform: translate(-25%, -75%) rotate(0);
    }
    100% {
        transform: translate(-25%, -75%) rotate(360deg);
    }
}
.get_btn a:hover .liquid {
    top: -120px;
}
.get_btn a:hover span {
    color: #000;
}
.get_btn a:hover {
    color: #000 !important;
    box-shadow: 0 0 5px #d5ff0f, inset 0 0 5px #d5ff0f;
    transition-delay: 0.2s;
}

 @media screen and (max-width: 767px) {
 .main-header li a::after {
	 display: none;
 }	 
.get_btn {
	display: none;
}	 
 .main-header .menu-icon {
	 display: block;
}
 .main-header .menu-icon__line {
	 animation: closedMid 0.8s backwards;
	 animation-direction: reverse;
}
 .main-header .menu-icon__line::before {
	 animation: closedTop 0.8s backwards;
	 animation-direction: reverse;
}
 .main-header .menu-icon__line::after {
	 animation: closedBtm 0.8s backwards;
	 animation-direction: reverse;
}
.main-header .nav-links {
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	/* padding: 10rem 0; */
	width: 100vw;
	height: 100vh;
	font-size: 2rem;
	color: #fff;
	background: #000000f2;
	transition: opacity 0.8s 0.5s, clip-path 1s 0.5s;
	clip-path: circle(200px at top right);
	z-index: 3;
}
.main-header .nav-links .nav-link {
	opacity: 0;
	transform: translateX(100%);
	width: 100%;
	text-align: left;
	padding-left: 50px;
}
.main-header .nav-links .nav-link a {
	display: block;
	padding: 20px 0;
}
 .main-header .menu-btn:checked ~ .nav-links {
	 opacity: 1;
	 clip-path: circle(100% at center);
}
 .main-header .menu-btn:checked ~ .nav-links .nav-link {
	 opacity: 1;
	 transform: translateX(0);
	 transition: opacity 0.4s ease-in-out, transform 0.6s cubic-bezier(0.175, 0.085, 0.32, 1.275);
}
 .main-header .menu-btn:checked ~ .nav-links .nav-link:nth-of-type(1) {
	 transition-delay: 0.7s;
}
 .main-header .menu-btn:checked ~ .nav-links .nav-link:nth-of-type(2) {
	 transition-delay: 0.8s;
}
 .main-header .menu-btn:checked ~ .nav-links .nav-link:nth-of-type(3) {
	 transition-delay: 0.9s;
}
 .main-header .menu-btn:checked ~ .nav-links .nav-link:nth-of-type(4) {
	 transition-delay: 1s;
}
 .main-header .menu-btn:checked ~ .menu-icon {
	 border-radius: 50%;
	 animation: pulse 1s;
}
 .main-header .menu-btn:checked ~ .menu-icon .menu-icon__line {
	 background: #fff;
	 animation: openMid 0.8s forwards;
}
 .main-header .menu-btn:checked ~ .menu-icon .menu-icon__line::before {
	 background: white;
	 animation: openTop 0.8s forwards;
}
 .main-header .menu-btn:checked ~ .menu-icon .menu-icon__line::after {
	 background: white;
	 animation: openBtm 0.8s forwards;
}
}
 @keyframes pulse {
	 from {
		 box-shadow: 0 0 0 0px rgba(255, 255, 255, 0.6);
		 background: rgba(255, 255, 255, 0.6);
	}
	 to {
		 box-shadow: 0 0 0 1000px rgba(255, 255, 255, 0);
		 background: rgba(255, 255, 255, 0);
	}
}
 @keyframes openTop {
	 0% {
		 transform: translateY(-5px) rotate(0deg);
	}
	 50% {
		 transform: translateY(0px) rotate(0deg);
	}
	 100% {
		 transform: translateY(0px) rotate(90deg);
	}
}
 @keyframes closedTop {
	 0% {
		 transform: translateY(-5px) rotate(0deg);
	}
	 50% {
		 transform: translateY(0px) rotate(0deg);
	}
	 100% {
		 transform: translateY(0px) rotate(90deg);
	}
}
 @keyframes openMid {
	 50% {
		 transform: rotate(0deg);
	}
	 100% {
		 transform: rotate(45deg);
	}
}
 @keyframes closedMid {
	 50% {
		 transform: rotate(0deg);
	}
	 100% {
		 transform: rotate(45deg);
	}
}
 @keyframes openBtm {
	 0% {
		 transform: translateY(5px) rotate(0deg);
	}
	 50% {
		 transform: translateY(0px) rotate(0deg);
	}
	 100% {
		 transform: translateY(0px) rotate(90deg);
	}
}
 @keyframes closedBtm {
	 0% {
		 transform: translateY(5px) rotate(0deg);
	}
	 50% {
		 transform: translateY(0px) rotate(0deg);
	}
	 100% {
		 transform: translateY(0px) rotate(90deg);
	}
}