.Sticky.is-fixed { position: fixed; z-index: 2; box-sizing: border-box } .AppHeader { position: relative; overflow: hidden; background: #fff; border-bottom: 1px solid rgba(30, 35, 42, .06); box-shadow: 0 1px 3px 0 rgba(0, 34, 77, .05); background-clip: content-box } .AppHeader, .AppHeader.is-fixed { z-index: 100 } .AppHeader-inner { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; width: 1000px; height: 60px; padding: 0 16px; margin: 0 auto; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-transition: -webkit-transform.3s; transition: -webkit-transform.3s; transition: transform.3s; transition: transform.3s, -webkit-transform.3s } .AppHeader.is-hidden .AppHeader-inner{ -webkit-transform:translateY(-100%); transform:translateY(-100%) } .PageHeader { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -webkit-transition: -webkit-transform.3s; transition: -webkit-transform.3s; transition: transform.3s; transition: transform.3s, -webkit-transform.3s; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; } .PageHeader:not(.is-shown){ -webkit-transform: translateY(100%); transform: translateY(100%) }