/* Geezbook top-bar CSS-sprite wordmark v4
 * Uses the supplied asset4.png artwork (byte-identical to this bundled
 * 200x170 ui215 apps sprite).
 * Geezbook wordmark source region: x=18..170, y=56..93.
 * Every scale leaves a sub-pixel blue safety inset around the first and last
 * antialiased pixels so the g/k edges cannot be clipped by overflow:hidden.
 */
.geezbook-wordmark{display:block;width:auto;max-width:none;border:0;margin:0;padding:0}

/* Standard desktop top bars / headers: use CSS sprite, not a standalone image. */
.topbar .brand,
.gb13-logo,
.pokes-php-brand,
.mobile-info-desktop-topbar .brand,
.rb404-top.logged .rb404-logo,
.admin-head .admin-brand a,
.gb-recovery-brand,
.mi-login-brand,
.login-logo,
.top .brand{
  display:block;
  width:152px;
  height:38px;
  min-width:152px;
  padding:0;
  border:0;
  overflow:hidden;
  background-color:#3b5998;
  background-image:url('/assets/ui215/apps-sprite-215uo.png?v=4-asset4-complete');
  background-repeat:no-repeat;
  background-position:-19px -56px;
  color:transparent;
  text-indent:-9999px;
  text-shadow:none;
  line-height:38px;
  white-space:nowrap;
}
.topbar .brand .geezbook-wordmark,
.gb13-logo .geezbook-wordmark,
.pokes-php-brand .geezbook-wordmark,
.mobile-info-desktop-topbar .brand .geezbook-wordmark,
.rb404-top.logged .rb404-logo .geezbook-wordmark,
.admin-head .admin-brand a .geezbook-wordmark,
.gb-recovery-brand .geezbook-wordmark,
.mi-login-brand .geezbook-wordmark,
.login-logo .geezbook-wordmark,
.top .brand .geezbook-wordmark{display:none!important}

/* Taller logged-out headers use the same natural 152x38 sprite wordmark. */
.rb404-top.guest .rb404-logo,
.admin-top-login .login-logo{
  display:block;
  width:152px;
  height:38px;
  min-width:152px;
  padding:0;
  overflow:hidden;
  background-image: url('/assets/admin/geezping.png');
  background-size: contain; 
  background-repeat: no-repeat;
  background-position: center;
  color:transparent;
  text-indent:-9999px;
  text-shadow:none;
  white-space:nowrap;
}
.rb404-top.guest .rb404-logo .geezbook-wordmark,
.admin-top-login .login-logo .geezbook-wordmark{display:none!important}

/* Admin's compact authenticated masthead gets a smaller CSS-sprite crop. */
.admin-head .admin-brand a{
  width:106px;
  min-width:106px;
  height:27px;
  background-image: url(/assets/admin/geezping.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-color: transparent;
  /*background-size:140px 119px;*/
  /*background-position:-13px -39px;*/
  line-height:27px;
}

/* Recovery/guest bars leave their existing vertical placement intact. */
.gb-recovery-brand,.mi-login-brand,.login-logo,.top .brand{margin:0}

/* Narrow screens: reduce only the chrome logo so nav/search still fit. */
@media(max-width:760px){
  .topbar .brand,
  .pokes-php-brand,
  .mobile-info-desktop-topbar .brand,
  .rb404-top.logged .rb404-logo,
  .admin-head .admin-brand a{
    width:106px;
    min-width:106px;
    height:27px;
    background-image: url(/assets/admin/geezping.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    background-color: transparent;
    /*background-size:140px 119px;
    background-position:-13px -39px;*/
    line-height:27px;
  }
  .rb404-top.guest .rb404-logo,
  .gb13-logo,
  .gb-recovery-brand,
  .mi-login-brand,
  .login-logo,
  .top .brand{
    width:126px;
    min-width:126px;
    height:32px;
    background-size:166px 141px;
    background-position:-16px -46px;
    line-height:32px;
  }
}

/* ===== v3: archive-size 103x31 CSS-sprite masthead + stable hover ===== */
@media(min-width:761px){
  .topbar .brand,
  .gb13-logo,
  .topbar .brand:hover,
  .topbar .brand:focus,
  .topbar .brand:active,
  .pokes-php-brand,
  .pokes-php-brand:hover,
  .mobile-info-desktop-topbar .brand,
  .mobile-info-desktop-topbar .brand:hover,
  .rb404-top.logged .rb404-logo,
  .rb404-top.logged .rb404-logo:hover,
  .top .brand,
  .top .brand:hover{
    display:block!important;
    width:103px!important;
    min-width:103px!important;
    max-width:103px!important;
    height:31px!important;
    min-height:31px!important;
    padding:0 1px!important;
    overflow:hidden!important;
    background-color:#3b5998!important;
    background-image:url('/assets/ui215/apps-sprite-215uo.png?v=4-asset4-complete')!important;
    background-repeat:no-repeat!important;
    background-size:136px auto!important;
    background-position:-13px -38px!important;
    color:transparent!important;
    font-size:0!important;
    line-height:31px!important;
    text-indent:-9999px!important;
    text-shadow:none!important;
    text-decoration:none!important;
    white-space:nowrap!important;
    opacity:1!important;
    filter:none!important;
  }
}

/* The authenticated topbar is the user-visible asset4 crop.  Keep the other
   historical mastheads at their existing geometry and give this one a blue
   inset on every side. */
@media(min-width:761px){
  .topbar .brand,
  .gb13-logo,
  .topbar .brand:hover,
  .topbar .brand:focus,
  .topbar .brand:active{
    background-image:url('/assets/ui215/apps-sprite-215uo.png?v=4-asset4-complete')!important;
    background-size:132px auto!important;
    background-position:-11px -34px!important;
  }
}
@media(max-width:760px){
  .topbar .brand,
  .gb13-logo,
  .topbar .brand:hover,
  .topbar .brand:focus,
  .topbar .brand:active{
    width:106px!important;
    min-width:106px!important;
    max-width:106px!important;
    height:27px!important;
    min-height:27px!important;
    padding:0 1px!important;
    background-image:url('/assets/ui215/apps-sprite-215uo.png?v=4-asset4-complete')!important;
    background-size:135px auto!important;
    background-position:-11px -37px!important;
  }
}
