/* @Author       : Junchen-Yi
 * @Designer	 : Taohua-Nong
 * @Date         : 2023-3-22 19:32:02
 * @Program name : navgaion.css
 * Copyright (c) 2024 by Junchen-Yi Taohua-Nong, All Rights Reserved.
 */
/* default css start */
.nav-5{
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 10000;
}
.nav-close{
	display: none;
}
.site-logo-5{
	margin-top: 10px;
}
.nav-logo{
	width: 130px;
	height: 35px;
}
.container {
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 15px;
}
.header-area {
  background-color: #000000;
}
/* default css end */


/* navbar regular css start */
.navbar-area {
  background: rgba(0,0,0,.6);
  border-bottom: 1px solid #000;
}
.site-navbar {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding-top: 15px;
      padding-bottom: 15px;
  }
}
a.site-logo {
  font-size: 26px;
  font-weight: 800;
  text-transform: uppercase;
  color: #fff;
  text-decoration: none;
}
.site-navbar ul {
  margin: 0;
      padding: 0;
      list-style: none;
      display: flex;
      flex-direction: row;
      flex-wrap: nowrap;
      align-content: center;
      align-items: center;
}
.language-index-nav {
    color: #ffffff;
    font-size: 15px;
    margin-right: 14px;
    margin-top:5px ;
	}
.navgation-right{
	display: flex;
	    flex-direction: row;
	    flex-wrap: nowrap;
	    align-items: center;
	    align-content: center;
	    justify-content: center;
}
/* .site-navbar ul li a {
  color: #fff;
  padding: 20px;
  display: block;
  font-size: medium;
  text-decoration: none;
  font-family: "SF Pro Text","Myriad Set Pro","SF Pro Icons","Apple Legacy Chevron","Helvetica Neue","Helvetica","Arial",sans-serif;
  
} */
.nav-li-5-a{
	text-decoration: none;
	color: #ffffff!important;
	  padding: 10px;
	  font-size: 12px;
	  font-family: "SF Pro Text","Myriad Set Pro","SF Pro Icons","Apple Legacy Chevron","Helvetica Neue","Helvetica","Arial",sans-serif;
	  
  }
/* .site-navbar ul li a:hover {
  background: rgba(255,255,255,.1);
} */
/* navbar regular css end */

.version-nav{
	display: none;	
}
.version-nav-close{
	display: none;
	transition-timing-function: ease-in-out;
	
}
@media only screen and (max-width:1024px) {

.version-nav{
	display: block!important;
/* 	margin-top: calc(100vh - 60px);
 */	text-align: center;
	color: #666666;
	font-size: 15px;
	font-family: "SF Pro Text","Myriad Set Pro","SF Pro Icons","Apple Legacy Chevron","Helvetica Neue","Helvetica","Arial",sans-serif;
	    bottom: 0;
		margin-top: 10px;
		margin-bottom: 20px;
		transition-timing-function: ease-in-out;
}

.version-nav-close{
	display: none;
	transition-timing-function: ease-in-out;
	
}
}
/* nav-toggler css start */
.nav-toggler {
  border: 0px;
  padding: 5px;
  background-color: transparent;
  cursor: pointer;
  height: 39px;
  display: none;
}
.nav-toggler span{
	background-color:#000000;
	height: 1px;
	display: block;
} 
.nav-toggler span:before{
	position: absolute;
	top: 35px;
	width: 28px;
	height: 2px;
	background-color: #fff;
	display: block;
	transition: .3s;
}
.nav-toggler span:after {
	position: relative;
  width: 28px;
  height: 2px;
  background-color: #fff;
  display: block;
  transition: .3s;
}
.nav-toggler span:before {
  content: '';
  transform: translateY(-9px);
/*  top:1px;
 */}
.nav-toggler span:after {
  content: '';
  transform: translateY(6px);
}
.nav-toggler.toggler-open span {
  background-color: transparent;
}
.nav-toggler.toggler-open span:before {
  transform: translateY(0px) rotate(45deg);
  margin-top: -2px;
}
.nav-toggler.toggler-open span:after {
  transform: translateY(-3px) rotate(-45deg);
  margin-top: 13px;
}
/* nav-toggler css start */


/* intro-area css start */
.intro-area {
  height: calc(100vh - 61px);
  display: flex;
  align-items: center;
  text-align: center;
  color: #fff;
}
.intro-area h2 {
  font-size: 50px;
  font-weight: 300;
  line-height: 50px;
  margin-bottom: 25px;
}
.intro-area p {
  font-size: 18px;
}
/* intro-area css end */


/* mobile breakpoint start */
@media screen and (max-width: 1024px) {
  .container {
    /* max-width: 720px; */
  }
  /* navbar css for mobile start */
  .nav-toggler{
    display: block;
  }
  .site-navbar {
    min-height: 60px;
	padding: 0;
  }
  .site-navbar ul {
    position: absolute;
        width: 100%;
        height: calc(100vh - 60px);
        left: 0;
        top: 60px;
        flex-direction: column;
        align-items: center;
        background-color: #161617;
        max-height: 0;
        overflow: hidden;
        transition: .4s;
        transition-timing-function: ease-in-out;
        display: flex;
        flex-wrap: nowrap;
        align-content: center;
	
  }
  /* .site-navbar ul li {
    width: 85%;
	height: 54px;
    text-align: left;
	border-bottom: #424245 solid 1px;
	
  } */
  .nav-li-5{
	  width: 85%;
	  height: 45px;
	  text-align: left;
	  margin-bottom: 5px;
/* 	  border-bottom: #424245 solid 1px;
 */	  
  }
 /* .site-navbar ul li a {
    padding: 25px;
	font-size: 16px;
	font-family: "SF Pro Text","Myriad Set Pro","SF Pro Icons","Apple Legacy Chevron","Helvetica Neue","Helvetica","Arial",sans-serif;
	
  } */
  .nav-li-5-a{
	  padding-left: 20px;
	  padding-right: 20px;
	  padding-top: 25px;
	  padding-bottom: 25px;
	  font-size: 27px;
	  font-family: "SF Pro Text","Myriad Set Pro","SF Pro Icons","Apple Legacy Chevron","Helvetica Neue","Helvetica","Arial",sans-serif;
	  color: #ffffff!important;
	  font-weight: 500;
	  letter-spacing: 0.06em;
	  text-decoration: none;
	  
  }
  /* .site-navbar ul li a:hover {
    background-color: rgba(255,255,255,.1);
  } */
  .site-navbar ul.open {
	 flex-direction: column;
	     align-items: center;
	     max-height: 100vh;
	     padding-top: 30px;
	     display: flex;
	     flex-wrap: nowrap;
  }
  .intro-area h2 {
    font-size: 36px;
    margin-bottom: 15px;
  }  
  /* navbar css for mobile end */
}
/* mobile breakpoint end */