.navbar {

  position: absolute;

  left: 0;

  top: 70px;

  padding: 0;

  width: 100%;

  z-index: 2;

}



.navbar .navbar-brand {

  width: 350px;

  margin-left: 15px;

}



.navbar .navbar-brand img {

  width: 100%;

}



.navbar .navbar-toggler {

  position: relative;

  height: 60px;

  width: 60px;

  border: none;

  cursor: pointer;

  outline: none;

}



.navbar .navbar-toggler .menu-icon-bar {

  position: absolute;

  left: 15px;

  right: 15px;

  height: 2px;

  background-color: #fff;

  opacity: 0;

  -webkit-transform: translateY(-1px);

  -ms-transform: translateY(-1px);

  transform: translateY(-1px);

  transition: all 0.3s ease-in;

}



.navbar .navbar-toggler .menu-icon-bar:first-child {

  opacity: 1;

  -webkit-transform: translateY(-1px) rotate(45deg);

  -ms-sform: translateY(-1px) rotate(45deg);

  transform: translateY(-1px) rotate(45deg);

}



.navbar .navbar-toggler .menu-icon-bar:last-child {

  opacity: 1;

  -webkit-transform: translateY(-1px) rotate(135deg);

  -ms-sform: translateY(-1px) rotate(135deg);

  transform: translateY(-1px) rotate(135deg);

}



.navbar .navbar-toggler.collapsed .menu-icon-bar {

  opacity: 1;

}



.navbar .navbar-toggler.collapsed .menu-icon-bar:first-child {

  -webkit-transform: translateY(-7px) rotate(0);

  -ms-sform: translateY(-7px) rotate(0);

  transform: translateY(-7px) rotate(0);

}



.navbar .navbar-toggler.collapsed .menu-icon-bar:last-child {

  -webkit-transform: translateY(5px) rotate(0);

  -ms-sform: translateY(5px) rotate(0);

  transform: translateY(5px) rotate(0);

}



.navbar-dark .navbar-nav .nav-link {

  position: relative;

  color: #fff;

  font-size: 1rem;

  font-family: 'Roboto', sans-serif;

  font-weight: 400;

  text-transform: uppercase;

  margin-left: 10px;

}



.navbar-dark .navbar-nav .nav-link:focus {

  color: #fff;

}



.navbar-dark .navbar-nav .nav-link:hover {

  color: #FFCC01;

}



.navbar .dropdown-menu {

  padding: 0;

  background-color: #FFCC01;

  transition: opacity .15s ease-in-out;

}



.navbar .dropdown-menu .dropdown-item {

  position: relative;

  padding: 15px 20px;

  color: #fff;

  font-size: 14px;

  font-family: 'Roboto', sans-serif;

  border-bottom: 1px solid rgba(255, 255, 255, .1);

  transition: color 0.2s ease-in;

}



.navbar .dropdown-menu .dropdown-item:last-child {

  border-bottom: none;

}



.navbar .dropdown-menu .dropdown-item:hover {

  background: transparent;

  color: #fff;

}



.navbar .dropdown-menu .dropdown-item::before {

  content: '';

  position: absolute;

  bottom: 0;

  left: 0;

  top: 0;

  width: 5px;

  background-color: #fff;

  opacity: 0;

  transition: opacity 0.2s ease-in;

}



.navbar .dropdown-menu .dropdown-item:hover::before {

  opacity: 1;

}



.navbar.fixed-top {

  position: fixed;

  top: 0;

  background-color: #FFCC01;

}



.navbar.fixed-top.navbar-dark .navbar-nav .nav-link {

  color: #fff;

}



.navbar.fixed-top.navbar-dark .navbar-brand {

  width: 200px;

}



.navbar.fixed-top.navbar-dark .navbar-nav .nav-link {

  font-size: 14px;

}



.navbar.fixed-top.navbar-dark .navbar-nav .nav-link.active {

  color: #FFCC01;

}



.navbar.fixed-top.navbar-dark .navbar-nav .nav-link::after {

  background-color: #fff;

}



.content {

  padding: 120px 0;

}



.dropdown-toggle::after {

  transition: transform 0.15s linear; 

}



.show.dropdown .dropdown-toggle::after {

 transform: translateY(3px);

}



.dropdown-menu {

 margin-top: 0;

}



@media (max-width:767px) {

  .navbar {

    top: 20px;

  }



  .navbar .navbar-brand {

    margin-top: 0px;

  }



  .navbar .navbar-brand {

    width: 250px;

  }



}



@media screen and (max-width: 991px) {



  /*

  .navbar-brand {

    margin-left: 20px;

  }

*/

  .navbar-nav {

    padding: 0 20px;

    background-color: #FFF;

  }



  .navbar-collapse .navbar-nav .nav-link {

    color: #000;

    border-bottom: solid 1px #ddd;

    line-height: 2;

    margin-left: 0px;

  }



  .navbar-collapse .navbar-nav .contact-link {

    font-size: 13px;

    padding: 0px;

    border-bottom: none;

  }



  .navbar.fixed-top .navbar-nav {

    background: transparent;

  }



  .navbar .dropdown-menu {

    padding: 0;

    background-color: rgba(255, 255, 255);

    border: none;

  }



  .navbar .dropdown-menu .dropdown-item {

    position: relative;

    padding: 15px 20px;

    color: #000;

    font-size: 14px;

    font-family: 'Roboto', sans-serif;

    border-bottom: solid 1px #ddd;

    transition: color 0.2s ease-in;

  }



  .navbar.fixed-top.navbar-dark .navbar-nav .dropdown-menu .dropdown-item {

    color: #FFF;

    background: #000;

  }



  .navbar-dark .navbar-nav .nav-link:focus,

  .navbar-dark .navbar-nav .nav-link:hover {

    color: #000;

  }





}



@media screen and (min-width: 991px) {

  .banner {

    padding: 0 150px;

  }



  .banner h1 {

    font-size: 5rem;

  }



  .banner p {

    font-size: 2rem;

  }



  .navbar-dark .navbar-nav .nav-link {

    padding: 23px 15px;

  }



  .navbar-dark .navbar-nav .nav-link::after {

    content: '';

    position: absolute;

    bottom: 15px;

    left: 30%;

    right: 30%;

    height: 1px;

    background-color: #fff;

    -webkit-transform: scaleX(0);

    -ms-transform: scaleX(0);

    transform: scaleX(0);

    transition: transform 0.1s ease-in;

  }



  .navbar-dark .navbar-nav .nav-link:hover::after {

    -webkit-transform: scaleX(1);

    -ms-transform: scaleX(1);

    transform: scaleX(1);

  }



  .dropdown-menu {

    min-width: 200px;

    -webkit-animation: dropdown-animation 0.4s;

    animation: dropdown-animation 0.4s;

    -webkit-transform-origin: top;

    -ms-transform-origin: top;

    transform-origin: top;

  }

}



@-webkit-keyframes navbar-animation {

  0% {

    opacity: 0;

    -webkit-transform: translateY(-100%);

    -ms-transform: translateY(-100%);

    transform: translateY(-100%);

  }



  100% {

    opacity: 1;

    -webkit-transform: translateY(0);

    -ms-transform: translateY(0);

    transform: translateY(0);

  }

}



@keyframes navbar-animation {

  0% {

    opacity: 0;

    -webkit-transform: translateY(-100%);

    -ms-transform: translateY(-100%);

    transform: translateY(-100%);

  }



  100% {

    opacity: 1;

    -webkit-transform: translateY(0);

    -ms-transform: translateY(0);

    transform: translateY(0);

  }

}



@-webkit-keyframes dropdown-animation {

  0% {

    -webkit-transform: scaleY(0);

    -ms-transform: scaleY(0);

    transform: scaleY(0);

  }



  75% {

    -webkit-transform: scaleY(1.1);

    -ms-transform: scaleY(1.1);

    transform: scaleY(1.1);

  }



  100% {

    -webkit-transform: scaleY(1);

    -ms-transform: scaleY(1);

    transform: scaleY(1);

  }

}



@keyframes dropdown-animation {

  0% {

    -webkit-transform: scaleY(0);

    -ms-transform: scaleY(0);

    transform: scaleY(0);

  }



  75% {

    -webkit-transform: scaleY(1.1);

    -ms-transform: scaleY(1.1);

    transform: scaleY(1.1);

  }



  100% {

    -webkit-transform: scaleY(1);

    -ms-transform: scaleY(1);

    transform: scaleY(1);

  }

}