access-nyc-patterns/dist/objects/search-box/search-box.css

User Interface Patterns for Benefits Access

.o-search-box{position:absolute;left:0;right:0;width:100%;visibility:hidden;z-index:8}.o-search-box.active{visibility:visible}.o-search-box__inner{-webkit-transition:all .2s ease-out;-o-transition:all .2s ease-out;transition:all .2s ease-out;background:#eef3f7;max-height:0;overflow:hidden}.active .o-search-box__inner{border-bottom:3px solid #d1d5d9;max-height:1000px;padding:24px 0}.o-search-box__close{float:right}.o-search-box__form,.o-search-box__suggestions{clear:both;margin:48px auto;max-width:800px}.o-search-box__form label{display:block;margin-bottom:12px}.o-search-box__suggestions-header{margin-bottom:24px}.o-search-box__suggestions-header h3{margin-bottom:0}.o-search-box__suggestions-item{font-weight:700;padding-right:24px;margin-bottom:24px}@media screen and (min-width:768px){.o-search-box__suggestions-header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.o-search-box__suggestions-body{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.o-search-box__suggestions-item{width:33.33%}}