/*-------------------------
   Main Menu Area Start
--------------------------*/



.mainmenu-area.nav-fixed{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 99999;
  box-shadow: 0px 6px 8px 0px rgba(0,0,0,.08);
  background: #fff;
  margin-top: 0px;
  nav{
    box-shadow: none;
  }
}

 

.mainmenu-area{
  box-shadow: 0px 6px 8px 0px rgba(0,0,0,.08);
  .navbar{
    padding: 0px 0px;
    .navbar-brand{
      padding: 0px;
      margin: 0px;
      img{
        display: inline-block;
      }
    }
    #main_menu{
      .navbar-nav{
        .nav-item{
          padding: 0px;
          &.dropdown{
            &:hover{
              .dropdown-menu{
                display: block;
              }
            }
          }
            .dropdown-menu{
              position: absolute;
              z-index: 99;
              margin-top: 0px !important;
              background: #ffffff;
              border-radius: 0px;
              border: 0px;
              padding-bottom: 0px;
              padding-top: 0px;
              box-shadow: 0px 8px 14px 0px rgba(0, 0, 0, 0.15);
              transition: all linear .3s;
              .dropdown-item{
                color: #222;
                line-height: 24px;
                font-size: 14px;
                font-weight: 600;
                text-transform: uppercase;
                padding: 8px 15px 8px;
                border-bottom: 1px solid rgba(0, 0, 0, 0.10);
                transition: all linear .3s;
                i{
                  margin-right: 5px;
                  font-size: 12px;
                }
                &:hover,
                &.active
                {
                  color: $base-color;
                  background: #fff;
                }
              }
            }
          }
          .nav-link{
            color: #222;
            line-height: 24px;
            font-size: 14px;
            font-weight: 600;
            position: relative;
            padding: 15px 10px;
            text-transform: uppercase;
            transition: all linear .3s;
            position: relative;
            z-index: 3;
            &.active,
            &:hover{
              color: $base-color;
            }
          }
        }
      }

  }
}
.serch-icon-area{
  padding-left: 5px;
  padding-top: 16px;
  i{
    cursor: pointer;
    transition: $transition;
    &:hover{
      color: $base-color;
    }
  }
}
.search-form-area{
  display: block;
  width: 100%;
  position: absolute;
  left: 0px;
  padding: 0px 15px;
  top: 100%;
  background: #fff;
  box-shadow: 0px 8px 14px 0px rgba(0, 0, 0, 0.15);
  border-top: 4px solid $base-color;
  z-index: 99;
  display: none;
  transition: $transition;
  .search-form{
    input{
      border: 0px;
      width: 100%;
      height: 45px;
    }
  }
  &.open{
    top: 100%;
    visibility: visible;
    opacity: 1;
  }
}

.mainmenu-area .navbar #main_menu .navbar-nav .nav-item.mega-menu,
.mainmenu-area .navbar #main_menu .navbar-nav .nav-item.mega-menu .nav-link
{
  position: inherit;
}

.mainmenu-area .navbar #main_menu .navbar-nav .nav-item.mega-menu .dropdown-menu{
  width: 100%;
}

.mainmenu-area .navbar #main_menu .navbar-nav .nav-item.mega-menu .dropdown-menu .title{
  font-size: 18px;
  font-weight: 600;
  margin-top: 16px;
  color: $base-color;
}

.mainmenu-area .navbar #main_menu .navbar-nav .nav-item.mega-menu .dropdown-menu .nav-item .nav-link{
  padding: 2px 0px;
  font-size: 14px;
-webkit-transition: all linear .3s;
transition: all linear .3s;
}
.mainmenu-area .navbar #main_menu .navbar-nav .nav-item.mega-menu .dropdown-menu .nav-item .nav-link i{
  font-size: 12px;
  margin-right: 4px;
}
.mainmenu-area .navbar #main_menu .navbar-nav .nav-item.mega-menu .dropdown-menu .nav-item .nav-link:hover{
  padding-left: 7px;
}
.mainmenu-area .navbar #main_menu .navbar-nav .nav-item.mega-menu .nav{
  background: rgba(0, 0, 0, 0.03);
  height: 100%;
}
.mainmenu-area .navbar #main_menu .navbar-nav .nav-item.mega-menu .tab-content .tab-pane{
  padding-top: 20px;
  padding-bottom: 15px;
}
.mainmenu-area .navbar #main_menu .navbar-nav .nav-item.mega-menu .nav .nav-link{
  border-left: 3px solid transparent;
  padding: 7px 10px ;
}
.mainmenu-area .navbar #main_menu .navbar-nav .nav-item.mega-menu .nav .nav-link:hover{
  border-left: 3px solid $base-color;
}
.mainmenu-area .navbar #main_menu .navbar-nav .nav-item.mega-menu .nav .nav-link.active{
  border-left: 3px solid $base-color;
}


.navsm{
  padding: 7px 0px;
  display: flex;
  justify-content: space-between;
  .toogle-icon{
    font-size: 20px;
  }
  .serch-icon{
    font-size: 20px;
  }
}

.mobile-menu{
  //display: none;
  position: fixed;
  top: 0px;
  left: 0%;
  width: 50%;
  height: 100%;
  overflow-y: auto;
  background: rgba(255, 255, 255, 0.99);
  z-index: 999999;
  padding: 30px 30px;
  transition: $transition;
  left : -350px;
  opacity : 0;
  .logo-area{
    position: relative;
    .close-menu{
      cursor: pointer;
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      right: 0px;
      width: 35px;
      height: 35px;
      border: 1px solid rgba(0, 0, 0, 0.2);
      border-radius: 50%;
      line-height: 37px;
      text-align: center;
      i{
        font-size: 18px;
        color: #666;
      }
    }
    .navbar-logo{
      display: inline-block;
      margin-bottom: 10px;
    }
  }
  .mobile-menu-list{
    li{
      display: block;
      border-bottom: 1px dashed rgba(0, 0, 0, 0.2);
      &:last-child{
        border-bottom: 0px;
      }
      a{
        font-weight: 600;
        font-size: 18px;
        line-height: 44px;
        position: relative;
        color: #333;
        width: 100%;
        display: block;
        .toggle-icon{
          position: absolute;
          top: 50%;
          transform: translateY(-50%);
          right: 0px;
        }
      }
      &.go-dropdown{
        .main-link{
          &.active{
            color: $base-color;
          }
        }
        .go-dropdown-menu{
          display: none;
          position: relative;
          padding-left: 30px;
          li{
            &:first-child{
              border-top: 1px dashed rgba(0, 0, 0, 0.2);
            }
            a{
              font-size: 16px;
              i{
                margin-right: 4px;
              }
            }
          }
        }
      }
    }
  }
}