.header{ 
      position: relative; 
      z-index: 2;
      .nav{
        padding: 25px 35px; 
        border-bottom: 1px solid #adadad;
        position: absolute;
        top: 0;
        width: 100%; 
        .navBar{
            display: flex !important;
            justify-content: space-between !important;   
            align-items: center ;
          .logo{
             a{
                font-size: 26px;
                color: #f4f4f4;
                font-weight: 700;
                text-transform: uppercase;
                font-family: 'Joan', serif;
             }
          }
          .nav_item{
              ul{
                    li{
                        padding-left:  30px;  
                        cursor: pointer; 
                        position: relative; 
                        display: inline-block; 
                        &:hover a{ 
                           width: 100%; 
                        }  
                        &:hover .sub_down{ 
                            top: 40px; 
                            opacity: 1 !important; 
                            margin-top: 0; 
                            visibility: visible; 
                            padding: 10px 10px 10px 10px; 
                        }
            
                        a{
                            font-size: 15px;
                            font-weight: 600;
                            color: #f3f3f3;
                            text-transform: uppercase;
                            font-family: 'Joan', serif;

                            .droppper{
                                font-size: 16px;
                            }
                            &:hover{
                                color: $primaryColor;
                            }
                        }
                        .sub_down{
                            background-color: $white;
                            border-radius: 5px;
                            padding: 10px 10px 10px 10px;
                            box-shadow: 1px 1.732px 20px 0px rgba(0,0,0,0.3);   
                            -webkit-transition: all 0.3s ease-in-out;
                            transition: all 0.3s ease-in-out;
                            position: absolute;
                            visibility: hidden;
                            display: block;
                            width: 250px; 
                            border: none !important;
                            opacity: 0;
                            top: 70px;
                            left: 0;
                            padding: 0;
                            z-index: 99;
                          li{
                               padding: 10px 10px;
                               width: 100%;
                               &:hover{
                                   background-color: $primaryColor;
                                   width: 100%;
                               } 
                               &:hover a{
                                color: $white ; 
                            } 
                              a{
                                font-size: 14px;
                                font-weight: 400;
                                color: black;
                              }
                     }
                    }
                  }
              }
          }
        } 
      }
//       .navNewClass{
//          position: fixed;
//           background-color: $white;
//           top: 0px;
//           left: 0;
//           box-shadow: 1px 1.332px 4px 2px #7c7c7c4d;
//           z-index: 5;
//           transition: all linear .4s; 
//           .navBar{
//             box-shadow: none;
//             padding: 10px 10px;
//           }
// }  
}