
*{padding: 0; margin: 0;}
a{text-decoration: none;}
body{
    background-image: url('../img/bg1.jpg');
    background-size: cover;
    background-position:center center;
    background-repeat: no-repeat;
    width: 100%;
    min-height: 100vh;
    background-attachment: fixed;
    background-color: #656565;
    overflow: hidden;
}

.home-logo{
    width: 300px;
    height: auto;
    display: block;
    margin: 14% auto 40px auto;
}
.home-logo-img{
  width:100%;
  user-select: none;
}


.header{display: table;margin: auto;overflow: hidden;z-index: 1000;height: auto;transition: all 0.3s;}
.header-sticky{
    position: fixed;
    background-color: #ababab;
    background-image: url('../img/bg/b (9).png');
}
#menuBtn{
    display: none;
}
#fullScreenBtn{
}
.header-btns{
    position: absolute;
    right: 0;
    top: 8px;
    z-index: 10000;
}
.header-btn{
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0, 2.79, 1, 3.54);
    font-size: 35px;
    font-weight: bolder;
    text-shadow: 0px 2px 3px #424242;
    color: #000000;
    margin: 0 10px 0 0;
    user-select: none;
}
.header-btn:hover{
    transform: scale(1.1);
    text-shadow: 0 0 5px black;
    color: white;
}
.nav{

margin: auto;

float: none;

display: table;
}
.nav-item{margin: 0 15px;}
.nav-item-link{
    display: block;
    position: relative;
    font-family: Gineso;
    font-size: 35px;
    text-transform: uppercase;
    color: #6f6f6f;
    padding: 20px 5px;
    transition: all 0.5s ease-in-out;
    cursor: pointer;
    font-weight: bolder;
    user-select: none;
    text-shadow: 0 0 1px black;
}
.nav-item-link:before {
  content: '';
  display: block;
  position: absolute;
  height: 40%;
  width: 1px;
  bottom: 23px;
  right: -15px;
  margin: auto;
  transition: all 0.3s ease-in-out;
  background-color: #6f6f6f;
}
.nav-item:nth-last-child(1) .nav-item-link::before{
    display: none;
}

.nav-item-link:hover {
   /* background-color: rgba(0, 0, 0, 0.58); */
   /* box-shadow: inset 0px 3px 13px 0px #000000; */
   color: black;
   text-shadow: 0 0 1px black;
}
.logo-container{margin: auto;display: none;position: fixed;top: 10px;left: 10px;background-color: rgba(193, 193, 193, 0.77);padding: 10px;box-shadow: 0 0 4px #505050;z-index: 10000;}
.logo{
    
width: 40px;
    
opacity: 0.8;
}

#bars {
    height: 25px;
    width: 40px;
    float: right;
    position: relative;
    margin: 15px 10px 0px 0px;
    cursor: pointer;
}

.bar {
   background: rgb(72, 72, 72);
   bottom: 1px;
   height: 3px;
   position: absolute;
   width: 3px;
   animation: sound 0ms -800ms linear infinite alternate;
}

@keyframes sound {
    0% {
       opacity: .35;
        height: 3px; 
    }
    100% {
        opacity: 1;       
        height: 100%;        
    }
}

.bar:nth-child(1)  { left: 1px; animation-duration: 474ms; }
.bar:nth-child(2)  { left: 5px; animation-duration: 433ms; }
.bar:nth-child(3)  { left: 9px; animation-duration: 407ms; }
.bar:nth-child(4)  { left: 13px; animation-duration: 458ms; }
.bar:nth-child(5)  { left: 17px; animation-duration: 400ms; }
.bar:nth-child(6)  { left: 21px; animation-duration: 427ms; }
.bar:nth-child(7)  { left: 25px; animation-duration: 441ms; }
.bar:nth-child(8)  { left: 29px; animation-duration: 419ms; }
.bar:nth-child(9)  { left: 33px; animation-duration: 487ms; }
.bar:nth-child(10) { left: 37px; animation-duration: 442ms; }

#pageAudio{display: none;}

@media only screen  and (max-width : 1367px) {
    .nav-item-link{font-size: 30px;text-shadow: 0 0 0px black;}
    .home-logo{width: 250px;margin: 9% auto 30px auto;}
}

@media only screen  and (max-width : 1024px) {
    .nav-item-link{
        
    }
    .home-logo{margin: 20% auto 10px auto;}
}
@media only screen  and (max-width : 768px) {
    .home-logo{width: 140px;margin: 5% auto 0px auto;}
    .nav-item-link{font-size: 25px;text-shadow: 0 0 0px black;}
}
@media only screen  and (max-width : 540px) {
   .home-logo{margin: 10vh auto 0px auto;}
    
    .nav-item{
        width: 100%;
        text-align: center;
        display: table;
        margin: auto;
        clear: both;
    }
    .nav-item-link{
    text-shadow: 0 0 1px black;
}
    .nav-item-link:before{
        display: none;
    }
  
}