﻿@media (min-width: 768px) {
  .sidebar__container .mega-menu__container {
    display: none;
  }
}
.sidebar__container li.has-child > ul {
  display: none;
}
.sidebar__container .logo-container {
  text-align: center;
  margin-bottom: 15px;
}
.sidebar__container ul.main-menu > li {
  padding: 10px 20px;
  position: relative;
}
.sidebar__container ul.main-menu ul {
  margin-left: 0;
}
.sidebar__container ul.main-menu a {
  color: #000;
}
.sidebar__container ul.main-menu span.fa.angle {
  margin-left: 7px;
  color: #dc3b4a;
  left: 10px;
  top: 0;
  position: absolute;
  font-weight: 600;
  font-size: 23px;
}
.sidebar__container ul.main-menu li.has-child ul > li {
  background-color: #eee;
  padding-inline-start: 10px;
}

nav .main-menu * {
  transition: all ease 400ms;
}
nav .main-menu > li {
  position: relative;
  display: inline-block;
  -moz-perspective: 200px;
  -ms-perspective: 200px;
  -webkit-perspective: 200px;
  perspective: 200px;
}
nav .main-menu > li.has-child:hover > ul {
  visibility: visible;
  background: #fff;
  -moz-transform: rotateX(0);
  -ms-transform: rotateX(0);
  -o-transform: rotateX(0);
  -webkit-transform: rotateX(0);
  transform: rotateX(0);
  opacity: 1;
}
nav .main-menu > li > a {
  position: relative;
  display: flex !important;
  align-items: center;
  column-gap: 5px;
  padding: 5px 7px;
  color: #717171 !important;
}
nav .main-menu > li > ul {
  visibility: hidden;
  opacity: 0;
  position: absolute;
  top: 100%;
  right: 0;
  background: #fff;
  min-width: 180px;
  width: max-content;
  z-index: 1000;
  transition: all 400ms;
  visibility: hidden;
  -moz-transform: rotateX(-90deg) rotateY(0);
  -ms-transform: rotateX(-90deg) rotateY(0);
  -o-transform: rotateX(-90deg) rotateY(0);
  -webkit-transform: rotateX(-90deg) rotateY(0);
  transform: rotateX(-90deg) rotateY(0);
  transform-origin: top;
  opacity: 0;
  top: 100%;
  right: 0;
}
nav .main-menu li {
  position: relative;
  padding: 7px;
  -moz-perspective: 200px;
  -ms-perspective: 200px;
  -webkit-perspective: 200px;
  perspective: 200px;
}
nav .main-menu li a {
  display: block;
  padding: 4px 20px;
  color: #717171;
  font-size: 14px;
  white-space: nowrap;
  text-decoration: none;
}
nav .main-menu li a:hover {
  text-decoration: none;
  color: #00315a;
}
nav .main-menu li ul li a {
  padding: 4px 10px;
}
nav .main-menu li ul li.has-child i {
  float: left;
  padding-top: 3px;
}
nav .main-menu li ul li.has-child i:before {
  content: "\f104";
}
nav .main-menu ul {
  text-align: right;
  visibility: hidden;
  -moz-transition: all 400ms;
  -o-transition: all 400ms;
  -webkit-transition: all 400ms;
  transition: all 400ms;
  -moz-transform: rotateY(-90deg);
  -ms-transform: rotateY(-90deg);
  -o-transform: rotateY(-90deg);
  -webkit-transform: rotateY(-90deg);
  transform: rotateY(-90deg);
  -moz-transform-origin: right;
  -ms-transform-origin: right;
  -o-transform-origin: right;
  -webkit-transform-origin: right;
  transform-origin: right;
  background: #fff;
  z-index: 100000;
  margin: 0;
  padding: 0;
  position: absolute;
  right: 100%;
  top: 0;
  opacity: 0;
}
nav .main-menu ul ul {
  border-radius: 0;
}
nav .main-menu ul li:hover {
  background-color: #f0f0f0;
}
nav .main-menu ul li.has-child:hover > ul {
  visibility: visible;
  background: #fff;
  min-width: 180px;
  width: max-content;
  -moz-transform: rotateY(0);
  -ms-transform: rotateY(0);
  -o-transform: rotateY(0);
  -webkit-transform: rotateY(0);
  transform: rotateY(0);
  opacity: 1;
}
nav .main-menu ul li a span.caret {
  -moz-transform: rotateZ(90deg);
  -ms-transform: rotateZ(90deg);
  -o-transform: rotateZ(90deg);
  -webkit-transform: rotateZ(90deg);
  transform: rotateZ(90deg);
}
