/* Banner with logos
 * | -- 3rd PaRTY Logo -- | --     App Logo     -- | --    LMU Logo   -- |
 * use only 50px vertical size with devices smaller than 786px horizontal resolution
 */

#proj-banner {
  display: flex;
  position: fixed;
  height:  50px;
  width: 100%;
  z-index: 1030;
  background: url("../images/banner-background.png") no-repeat 50% 0;
}

#proj-banner .branding-left {
  display: inline-flex;
  width: 25%;
  background: url("../images/branding-left.png") no-repeat 1px 1px,
              linear-gradient(to right, rgba(255,255,255,1), rgba(255,255,255,0.6), rgba(255,255,255,0)) no-repeat 0%;
  background-size:  auto 50px,     /* size of logo image  */
                    auto 50px;     /* width gradient left */
}
#proj-banner .branding-center{
  display: inline-block;
  width: 50%;
  background-size: 90% auto;
}
#proj-banner .branding-right {
  display: inline-flex;
  width: 25%;
  background: url("../images/branding-right.png") no-repeat 100% 0,
              linear-gradient(to left, rgba(255,255,255,1), rgba(255,255,255,0.6) , rgba(255,255,255,0)) no-repeat 100%;

  background-size:  auto 50px,     /* size of logo image  */
                    auto 50px;     /* width gradient right */
}