.global-header {
   font-size: 16px;
   position: fixed;
   z-index: 100;
   top: 0;
   left: 0;
   right: 0;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-pack: justify;
   -ms-flex-pack: justify;
   justify-content: space-between;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   padding-left: 2em;
   padding-right: 2em;
   font-family: 'Hind', sans-serif;
   background-color: rgba(255, 255, 255, .97);
}

.global-header section {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -ms-flex-line-pack: center;
   align-content: center;
   position: relative;
}

.global-header a {
   -webkit-transition: .2s;
   transition: .2s;
}

.global-header a:hover,
.global-header a:active,
.global-header a:focus {
   color: #1EAAB4;
}


/** COMPANY LOGO AND MOBILE MENU ICON
**/

.global-header section a:first-child {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   max-width: 10em;
   min-height: 5em;
   max-height: 5em;
   /* this dicatates global header height */
}

.global-header section a img {
   position: relative;
   z-index: -1;
}

.global-header section a:nth-child(2) {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   visibility: hidden;
   -webkit-box-pack: center;
   -ms-flex-pack: center;
   justify-content: center;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   min-width: 5em;
   min-height: 5em;
   /* this dicatates global header height */
}

.global-header section a:nth-child(2) img {
   height: 1em!important;
}


/** MAIN MENUS
**/

.global-header > ul {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-flex: 1;
   -ms-flex-positive: 1;
   flex-grow: 1;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   max-width: 70%;
   height: 5em;
   /* this dicatates global header height */
}

.global-header > ul > li {
   position: relative;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-flex: 1;
   -ms-flex-positive: 1;
   flex-grow: 1;
   height: inherit;
   margin-left: .1em;
   margin-right: .1em;
}

.global-header > ul > li:first-child {
   margin-left: 0;
}

.global-header > ul > li:last-child {
   margin-right: 0;
}

.global-header > ul > li > a {
   display: -webkit-inline-box;
   display: -ms-inline-flexbox;
   display: inline-flex;
   -webkit-box-flex: 1;
   -ms-flex-positive: 1;
   flex-grow: 1;
   -webkit-box-pack: center;
   -ms-flex-pack: center;
   justify-content: center;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   font-size: .6em;
   font-weight: 700;
   text-transform: uppercase;
   letter-spacing: .1em;
}

li.active::after {
   position: absolute;
   z-index: -1;
   bottom: 1em;
   left: 0;
   width: 100%;
   border-bottom: .2em solid #1EAAB4;
   content: '';
   -webkit-transform: translateZ(0);
   transform: translateZ(0);
   -webkit-animation: grow .3s forwards ease!important;
   animation: grow .3s forwards ease!important;
}

@-webkit-keyframes grow {
   0% {
      -webkit-transform: scale(0);
      transform: scale(0);
      opacity: 0;
   }
   100% {
      -webkit-transform: scale(1);
      transform: scale(1);
      opacity: 1;
   }
}

@keyframes grow {
   0% {
      -webkit-transform: scale(0);
      transform: scale(0);
      opacity: 0;
   }
   100% {
      -webkit-transform: scale(1);
      transform: scale(1);
      opacity: 1;
   }
}


/** SUB MENUS
**/

.global-header li ul {
   position: absolute;
   top: 5em;
   /* adjust to reflect global header height */
   left: 0;
   min-width: 100%;
   padding-top: 1em;
   padding-bottom: 1em;
   color: #888;
   line-height: 1.6;
   white-space: nowrap;
   -webkit-transition: .5s;
   transition: .5s;
   -webkit-transform: translateY(-50em);
   transform: translateY(-50em);
   -webkit-transform-origin: top;
   transform-origin: top;
   background-color: #222;
   box-shadow: 0 .3em .6em -.2em #222;
}

.global-header li ul::after {
   position: absolute;
   z-index: 1;
   top: -.4em;
   left: 5%;
   border-bottom: .4em solid #222;
   border-left: .4em solid transparent;
   border-right: .4em solid transparent;
   content: '';
}

.global-header li ul > li {
   padding: .5em;
   padding-left: 1.5em;
   padding-right: 1.5em;
   border-bottom: 1px solid rgba(255, 255, 255, 0.1);
   font-size: .7em;
   text-transform: uppercase;
   letter-spacing: .1em;
}

.global-header li ul > li:last-child {
   border: 0;
}


/** SUB MENU DROP DOWN ANIMATION
**/

.global-header li:hover > ul,
.global-header li ul.active {
   -webkit-transform: translateY(0);
   transform: translateY(0);
   /* reveal menu with transition*/
}


/** MOBILE AND TABLET SCREENS
**/

@media only screen and (max-width: 900px) {
   /** MOBILE MENU ICON
   **/
   .global-header > section {
      width: 100%;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
   }
   .global-header > section a:nth-child(2) {
      position: absolute;
      top: 0;
      right: 0;
      visibility: visible;
   }
   /** GLOBAL HEADER
   **/
   .global-header {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      max-height: 100vh;
      padding-left: 0;
      padding-right: 0;
      overflow: scroll;
   }
   .global-header > ul {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      min-width: 100%;
      min-height: 0;
      height: auto;
      line-height: 0;
   }
   .global-header > ul > li {
      margin-left: 0;
      margin-right: 0;
   }
   li.active::after {
      display: none;
   }
   .global-header > ul > li a {
      visibility: hidden;
      height: 0;
      -webkit-transition: .7s;
      transition: .7s;
      -webkit-transform: scale(0);
      transform: scale(0);
      opacity: 0;
      overflow: hidden;
   }
   .global-header > ul > li a.active {
      visibility: visible;
      height: 100%;
      padding: 3.5em;
      -webkit-transform: scale(1);
      transform: scale(1);
      opacity: 1;
   }
   /** SUB MENUS
   **/
   .global-header li ul {
      display: none;
   }
}