/* side menu desktop */



body{
  background: #fff ;
}
 button { outline: none; }

section{}






.sidenav{
  mix-blend-mode: normal;
mix-blend-mode: multiply;
mix-blend-mode: screen;
mix-blend-mode: overlay;
mix-blend-mode: darken;
mix-blend-mode: lighten;
mix-blend-mode: color-dodge;
mix-blend-mode: color-burn;
mix-blend-mode: hard-light;
mix-blend-mode: soft-light;
mix-blend-mode: difference;
mix-blend-mode: exclusion;
mix-blend-mode: hue;
mix-blend-mode: saturation;
mix-blend-mode: color;
mix-blend-mode: luminosity;
}
.sidenav.menu{
  position: fixed;
  top:50px;
}

.sidenav .logo{
  padding:10px;
}


.sidenav .airport-logo{
  margin-bottom: 50px;
}
.sidenav .menu-list{
  font-size: 0.9rem;
  padding-left: 6px;
}
.sidenav .menu-list li a{
  margin: 0;
  padding-left:20px;
  color: #000;
  opacity: 0.5;
  padding: .3em .75em;
}
.isDashboard .sidenav .menu-list li a{
  margin-bottom:0.6rem;
}
.sidenav .menu-list li a:hover, .sidenav .menu-list li.is-active a{
  opacity:1;
  background: #fafafa;
}

.sidenav .menu-list li.is-active::before{
  content:'.  ';
  background: #002cff; /* yellow is too pale */
      padding: .3em .75em;
  display: inline-block;
  position: absolute;

  padding-right:40px;
  margin-left:-56px;
  width:6px;
}
/*
.sidenav .menu-list li.is-active  {
  box-shadow: inset 0 0px 0 red, inset 0 -10px 0 #fffa00;

}*/
.sidenav .bottom p{
  margin: 0 ;
  margin-left: 20px;
  line-height: 0.7em;

}
/*
aside.menu.light, aside.menu.light a, aside.menu.light p, aside.menu.light .outline{
  color: rgba(255,255,255,0.5)!important;
  -webkit-text-stroke-color: red;
}

aside.menu.light{
  z-index: 1000;
  position:relative;
}
.hero{
  z-index: 50;
    position:absolute;
}
aside.menu.dark{
  z-index: 30
}*/


/* the burger button */
.burger-wrap{
  position: absolute;
  right: 10px;
  top:10px;
  cursor:crosshair;
  z-index: 2000000000100001 !important;
  color: white; /*doest work*/
}
.hamburger{
  color: #333; /*doest work*/
    z-index: 200000000000001 !important;
}
amp-sidebar[open] + p{
  background:red;
}

#burger{ /*
  menu shown on mobile
TODO: animation between show/hide
ex: https://hackernoon.com/how-to-create-fancy-revealing-animations-with-these-simple-css-tricks-5b34614ae69a

  */
  position: fixed;
  top:0;
  width: 100vw !important;
  height: 100%;
  text-align: center;
  position: absolute;
  z-index: 200000 !important;
  color: white !important;
  padding-top:20px;
  text-align: left;

}
#burger  h1, #burger a, #burger h2{
color: #000;
}


#burger .menu-list a:hover {
  /*  background-color: rgba(0,0,0,0.3);*/

}

#burger .g-signin2{
  margin:auto;
}

#burger .logo{
  width:50vw;
  max-width:300px;
  margin:  3em auto;
}
#burger h1::before{ /* hide the strike */
  display: none !important;
}
#burger .bg{
  background: #fff;
  width:100%;
  height: 100%;
  position: fixed;
  top: 0;
  z-index: 100;
}
#burger nav{
  width: 100%;
  position: fixed;
  z-index: 200000 ;
}
 #burger.show {
     display: block;
   }
 #burger.hide {
     display: none;
   }

   #burger .menu-list li a{
     padding: 20px 0;
     border-bottom: 1px solid #eee;
       font-size:2rem;
   }
   #burger .menu-list li a .icon{
     font-size: 1.8rem;
     margin-right: 0.3em;
   }

#burger .bg{
/*  -webkit-transition: all 0.3s;*/
  animation: fade-in ease 0.1s forwards;
}
   #burger.show .bg{
       opacity:1;

     }
     #burger.hide .bg{
       display: none;
         opacity:0.5;
       }

       @keyframes fade-in{
         from {
           opacity: 0;
         }
         to {
           opacity: 1;
         }
       }

   @keyframes fade-in-right {
     from {
       opacity: 0;
       transform: translateX(-15px);
     }
     to {
       opacity: 1;
       transform: translateX(0);
     }
   }

   @keyframes grow-left {
     from {
       transform: scaleX(0);
     }
     to {
       transform: scaleX(1);
     }
   }




.agent-1, .agent-3 {
  opacity: 0;
  animation: fade-in-right ease 0.2s forwards;
}

.agent-2 {
  transform: scaleX(0);
  transform-origin: left;
  animation: grow-left cubic-bezier(0.785, 0.135, 0.15, 0.86) 0.5s forwards;
  animation-delay: 0.2s;
}

.agent-3 {
  animation-delay: 0.2s;
}


#mobilelogo{
  background: transparent;
  position: absolute;
  top:0;
  left:0;
  z-index: 4;

  margin-left:20px;
  margin-top:20px;
  transform-origin: top left;
}
#mobilelogo img{height: 70px;}

/*
#mobileheader .navbar{
  background: transparent;
  position: absolute;
  top:0;
  width: 100%;
}


#mobileheader{
  border:2px red solid;
}*/


/* article-card  */
a.article-card  {
color: inherit;
display: block;
margin-bottom: 20px;
}

a.article-card .column {
opacity:1 !important;
color: inherit;
 transition: all 0.3s;
 /*padding-top:0;*/
 padding-bottom:4px;
 /*padding-left:0;*/
}

a.article-card:hover .column{
  opacity:0.8!important;
}
a.article-card:hover .column {

}

/* Guide and Tools menus   */

.tabs.is-boxed li.is-active.guide1 a   {
color:white;
background-color: #60dcff;
}





.foot{
  background: #dbdce0;
  min-height: 300px;
  padding-top: 30px;
  padding-bottom: 20px;
}
.foot, .foot a{
  color: #666;
}
 .foot a:hover{
   color:black;
 }

.foot li a{font-size: 0.8rem;}