* {
  transition: .25s ease-in-out;
  box-sizing: border-box; }

body {
  background: #d9e4ea; }

span {
  display: block;
  background: #03353B;
  border-radius: 2px; }

#menu-toggle {
  width: 100px;
  height: 100px;
  margin: 50px auto;
  position: relative;
  position: relative;
  cursor: pointer;
  background: rgba(255, 255, 255, 0.4);
  border-radius: 5px; }
  #menu-toggle:hover {
    background: rgba(255, 255, 255, 0.8); }
  #menu-toggle #hamburger {
    position: absolute;
    height: 100%;
    width: 100%; }
    #menu-toggle #hamburger span {
      width: 60px;
      height: 4px;
      position: relative;
      top: 24px;
      left: 20px;
      margin: 10px 0; }
      #menu-toggle #hamburger span:nth-child(1) {
        transition-delay: .5s; }
      #menu-toggle #hamburger span:nth-child(2) {
        transition-delay: .625s; }
      #menu-toggle #hamburger span:nth-child(3) {
        transition-delay: .75s; }
  #menu-toggle #cross {
    position: absolute;
    height: 100%;
    width: 100%;
    transform: rotate(45deg); }
    #menu-toggle #cross span:nth-child(1) {
      height: 0%;
      width: 4px;
      position: absolute;
      top: 10%;
      left: 48px;
      transition-delay: 0s; }
    #menu-toggle #cross span:nth-child(2) {
      width: 0%;
      height: 4px;
      position: absolute;
      left: 10%;
      top: 48px;
      transition-delay: .25s; }

#menu-toggle.open #hamburger span {
  width: 0%; }
  #menu-toggle.open #hamburger span:nth-child(1) {
    transition-delay: 0s; }
  #menu-toggle.open #hamburger span:nth-child(2) {
    transition-delay: .125s; }
  #menu-toggle.open #hamburger span:nth-child(3) {
    transition-delay: .25s; }
#menu-toggle.open #cross span:nth-child(1) {
  height: 80%;
  transition-delay: .625s; }
#menu-toggle.open #cross span:nth-child(2) {
  width: 80%;
  transition-delay: .375s; }

/* Custom code */
#menu-toggle.navbar-toggler {
  background: none !important;
  border: 0;
  height: 100px;
  margin: 0;
  padding: 0; }

/*# sourceMappingURL=hamburger-menu.css.map */