@charset "UTF-8";

/* Apply to all links within the navbar */
#TopNav .navbar-nav .nav-link {
   padding-left: 20px !important;
   padding-right: 20px !important;
}
@media (min-width: 768px) {
   #TopNav .animate {
      animation-duration: 0.3s;
      -webkit-animation-duration: 0.3s;
      animation-fill-mode: both;
      -webkit-animation-fill-mode: both;
   }
}
@keyframes submenuslideIn {
   0% {
      transform: translateY(1rem);
      opacity: 0;
   }
   100% {
      transform: translateY(0rem);
      opacity: 1;
   }
   0% {
      transform: translateY(1rem);
      opacity: 0;
   }
}
@-webkit-keyframes submenuslideIn {
   0% {
      -webkit-transform: transform;
      -webkit-opacity: 0;
   }
   100% {
      -webkit-transform: translateY(0);
      -webkit-opacity: 1;
   }
   0% {
      -webkit-transform: translateY(1rem);
      -webkit-opacity: 0;
   }
}
#TopNav .slideIn {
   -webkit-animation-name: submenuslideIn;
   animation-name: submenuslideIn;
}

/* This removes the built-in Bootstrap arrow */
#TopNav .dropdown-toggle::after {
   display: none !important;
}
/* rotate caret */
#TopNav .nav-link.dropdown-toggle {
   vertical-align: middle !important;
   display: inline-block !important;
}
#TopNav .nav-link.dropdown-toggle i {
   margin-left: 5px;
   display: inline-block;
   transition: transform 0.3s ease;
   transform: rotate(0deg);
}
#TopNav .nav-link.dropdown-toggle.show i {
   transform: rotate(180deg);
}

/* sub menu margin left */
@media (max-width: 768px) {

   #TopNav ul.dropdown-menu {
      width: 80% !important;
      margin-left: 20px !important;
   }

}