/* trackpipe/public/css/autocomplete_responsive.css */
:root {
    --mobile-results-height: calc(100vh - 101px);
    --mobile-results-text-width: calc(100vw - 73px);
    --mobile-results-height-tag: calc(100vh - 152px);
}
/* fixes for generic rules from trackpipe_basic.css & basic.css */
li.result-item, li.results-see-all, li.results-genre, li.results-tags, li.autocomplete-no-results {
    margin-top: 13px;
    margin-bottom: 13px;
}
button.menubar-search-icon {
    margin-right: 0;
    font-size: 100%;
    text-align: center;
}
li.result-item, li.results-see-all, li.results-genre, li.results-tags, li.autocomplete-no-results {
    margin-top: 0;
    margin-bottom: 0;
}

/* SEARCHBOX */
form.menubar-search.has-results .search-autocomplete li.result-item,
form.menubar-search .clear-autocomplete,
form.menubar-search .mobile-placeholder,
form.menubar-search .mobile-results-tags,
.menubar-2018-phone form.menubar-search,
form.menubar-search .tumbleweed,
form.menubar-search .search-autocomplete .no-show,
form.menubar-search .search-autocomplete li.results-genre,
form.menubar-search ul,
.cancel-autocomplete {
    display: none;
}
body.has-menubar-phone #menubar-wrapper form.menubar-search {
    display: block;
}
.menubar-outer.hide form.menubar-search,
.hd.hide form.menubar-search {
    visibility: hidden;
    opacity: 0;
}
form.menubar-search {
    outline: none;
    width: fit-content;
    float:right;
    visibility: visible;
    transition: visibility 0.2s, opacity .2s ease-in;
}
form.menubar-search:focus {
    box-shadow: 0 0 5px #d7d7d7;
}
form.menubar-search input[type=text] {
    -webkit-appearance: none;
    -moz-appearance: none;
    -webkit-user-select: auto;
    appearance: none;
    border-radius: 3px;
    color: rgba(22,17,19,0.7);
    outline: none;
    font-size: 14px;
    line-height: 16px;
    background: #f3f3f3;
    border: 1px solid #f3f3f3;
    width: 249px;
    height: 36px;
    padding: 0 35px 0 10px;
}
div.header-discover-2023 form.menubar-search input[type=text] {
    background: #efefef; 
}
body.invertIconography form.menubar-search input[type=text] {
    padding: 0 35px 2px 10px;
}
form.menubar-search.pending input[type=text] {
    width: 234px;
    padding-right: 50px;
}
body:not(.tralbum-page) #menubar-wrapper:not(.corp-home) form.menubar-search input[type=text] {
    width: 297px;
}
#menubar-wrapper form.menubar-search input[type=text] {
    width: 295px;
}
#menubar-wrapper form.menubar-search.pending input[type=text] {
    width: 280px;
    padding-right: 50px;
}
body:not(.tralbum-page) #menubar-wrapper:not(.corp-home) form.menubar-search.pending input[type=text] {
    width: 282px;
    padding-right: 50px;
}
form.menubar-search input[type=text]:focus{
    box-shadow: 0 0 5px #d7d7d7;
}
form.menubar-search.keyboard-focus input[type=text]:focus {
    background: #eef2f3;
}
form.menubar-search button.menubar-search-icon {
    background: transparent;
    border: none;
    height: 16px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    right: 12px;
    top: 11px;
    width: 16px;
    z-index: 11;
    text-indent: 0px;
    fill: #333;
}
.has-menubar.invertIconography #menubar.menubar-2018 button.menubar-search-icon .svg-icon {
    fill: #FFFFFF;
}
#menubar-wrapper form.menubar-search .menubar-search-icon,
#header-wrapper form.menubar-search .menubar-search-icon {
    display: block;
}
form.menubar-search .loading-icon {
    top: 10px;
    right: 32px;
}
form.menubar-search ul {
    position: absolute;
    right: 0;
    box-sizing: border-box;
    width: 100%;
    background-color: #fff;
    z-index: 11;
    padding: 0;
    margin: 0;
}

/* LIST ELEMENTS */
form.menubar-search li {
    list-style: none;
}
form.menubar-search li.simple {
    height: 50px;
    font-size: 14px;
    font-weight: 500;
}
form.menubar-search:not(.pending) li.simple {
    cursor: pointer;
}
form.menubar-search li.simple a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 100%;
    padding: 0 13px 0 20px;
    color: #fff;
}
form.menubar-search li.simple a > span {
    display: inline-block;
}
form.menubar-search li.simple a > span > svg {
    padding-top: 5px;
}
form.menubar-search svg.arrow {
    height: 24px;
    width: 24px;
    fill: currentColor;
}

/* KEYBOARD NAV */
body.search-active form.menubar-search.has-results ul.filter-list .filter-link.selected,
form.menubar-search .search-autocomplete li a.selected,
form.menubar-search:not(.pending) .genre-list li a.selected {
    outline: 2px solid blue !important;
    outline: -webkit-focus-ring-color auto 1px !important;
}
body.search-active form.menubar-search .key-nav {
    z-index: 111;
}

/* GENRE LIST */
body.search-active form.menubar-search:not(.has-results) .genre-list {
    top: 40px;
    display: unset;
}
form.menubar-search .genre-list li {
    background-color: #fff;
    margin: 0;
    height: 50px;
    color: #fff;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
form.menubar-search .genre-list li:nth-child(1) a,
.has-menubar.invertIconography #menubar.menubar-2018 #site-nav form.menubar-search .genre-list li:nth-child(1) a:focus,
.menubar-2018 #site-nav form.menubar-search .genre-list li:nth-child(1) a:focus { background-color: hsl(27, 90%, 68%); }
form.menubar-search .genre-list li:nth-child(2) a,
.has-menubar.invertIconography #menubar.menubar-2018 #site-nav form.menubar-search .genre-list li:nth-child(2) a:focus,
.menubar-2018 #site-nav form.menubar-search .genre-list li:nth-child(2) a:focus { background-color: hsl(11, 89%, 65%); }
form.menubar-search .genre-list li:nth-child(3) a,
.has-menubar.invertIconography #menubar.menubar-2018 #site-nav form.menubar-search .genre-list li:nth-child(3) a:focus,
.menubar-2018 #site-nav form.menubar-search .genre-list li:nth-child(3) a:focus { background-color: hsl(355, 74%, 51%); }
form.menubar-search .genre-list li:nth-child(4) a,
.has-menubar.invertIconography #menubar.menubar-2018 #site-nav form.menubar-search .genre-list li:nth-child(4) a:focus,
.menubar-2018 #site-nav form.menubar-search .genre-list li:nth-child(4) a:focus { background-color: hsl(339, 65%, 52%); }
form.menubar-search .genre-list li:nth-child(5) a,
.has-menubar.invertIconography #menubar.menubar-2018 #site-nav form.menubar-search .genre-list li:nth-child(5) a:focus,
.menubar-2018 #site-nav form.menubar-search .genre-list li:nth-child(5) a:focus { background-color: hsl(314, 51%, 50%); }
form.menubar-search .genre-list li:nth-child(6) a,
.has-menubar.invertIconography #menubar.menubar-2018 #site-nav form.menubar-search .genre-list li:nth-child(6) a:focus,
.menubar-2018 #site-nav form.menubar-search .genre-list li:nth-child(6) a:focus { background-color: hsl(277, 43%, 57%); }
form.menubar-search .genre-list li:nth-child(7) a,
.has-menubar.invertIconography #menubar.menubar-2018 #site-nav form.menubar-search .genre-list li:nth-child(7) a:focus,
.menubar-2018 #site-nav form.menubar-search .genre-list li:nth-child(7) a:focus { background-color: hsl(255, 29%, 57%); }
form.menubar-search .genre-list li:nth-child(8) a,
.has-menubar.invertIconography #menubar.menubar-2018 #site-nav form.menubar-search .genre-list li:nth-child(8) a:focus,
.menubar-2018 #site-nav form.menubar-search .genre-list li:nth-child(8) a:focus { background-color: hsl(231, 40%, 66%); }
form.menubar-search .genre-list li:nth-child(9) a,
.has-menubar.invertIconography #menubar.menubar-2018 #site-nav form.menubar-search .genre-list li:nth-child(9) a:focus,
.menubar-2018 #site-nav form.menubar-search .genre-list li:nth-child(9) a:focus { background-color: #87A8C5; }
form.menubar-search .genre-list li:nth-child(10) a,
.has-menubar.invertIconography #menubar.menubar-2018 #site-nav form.menubar-search .genre-list li:nth-child(10) a:focus,
.menubar-2018 #site-nav form.menubar-search .genre-list li:nth-child(10) a:focus { background-color: #333; }
form.menubar-search:not(.pending) .genre-list li:hover a,
form.menubar-search:not(.pending) .genre-list li a:not(.selected):focus {
    opacity: 0.9;
}

/* FILTERS */
body.search-active form.menubar-search.has-results ul.filter-list {
    box-shadow: 0 2px 4px 1px rgb(0 0 0 / 10%);
    display: flex;
    border-bottom: 2px solid #e5e5e5;
    padding: 0;
    margin: 0;
    margin-top: 2px;
}
body.search-active form.menubar-search.has-results ul.filter-list .filter-link.selected-filter {
    border-bottom: 2px solid #333;
    color: #333;
    cursor: default;
}
body.search-active form.menubar-search.has-results ul.filter-list .filter-link {
    font-size: 14px;
    text-align: center;
    padding: 12px 0;
    color: #1da0c3;
    margin-top: 0px;
    margin-bottom: -1px;
    line-height: 1.1;
    font-weight: 500;
    flex-grow: 1;
    border-bottom: 2px solid transparent;
    top: 0;
    background: none;
    white-space: nowrap;
}
form.menubar-search.has-results:not(.pending) ul.filter-list .filter-link:not(.selected-filter) {
    cursor: pointer;
}
body.search-active form.menubar-search.has-results ul.filter-list .filter-link.f {
    display: none;
}
form.menubar-search.has-results:not(.pending) ul.filter-list .filter-link:not(.selected-filter):hover {
        border-bottom: 2px solid #1DA0C3;
    }

/* RESULT LIST */
body.search-active form.menubar-search.has-results .search-autocomplete {
    display: unset;
    text-align: left;
}
form.menubar-search .search-autocomplete {
    background-color: #000;
    box-shadow: 0 2px 4px 1px rgb(0 0 0 / 10%);
    top: 81px;
}

/* RESULTS */
form.menubar-search .search-autocomplete li {
    background-color: #333;
    position: relative;
}
form.menubar-search .search-autocomplete li.result-item a {
    display: block;
    height: 50px;
    padding: 4px 6px;
    color: #222;
}
form.menubar-search .search-autocomplete li a,
#menubar form.menubar-search .search-autocomplete li:not(.results-see-all.key-nav, .results-genre.key-nav, .results-tags.key-nav) a:focus,
.has-menubar.invertIconography #menubar.menubar-2018 #site-nav form.menubar-search .search-autocomplete li:not(.simple) a:focus {
    background-color: #fff;
}
form.menubar-search .search-autocomplete li.result-item a > span {
    display: inline-block;
    height: 50px;
    font-size: 11px;
    line-height: 1.5;
    white-space: nowrap;
    vertical-align: top;
}
form.menubar-search .search-autocomplete li.result-item a > span.result-art {
    height: 50px;
    width: 50px;
    background-color: rgba(0,0,0,0.05);
}
form.menubar-search .search-autocomplete li.result-item a > span.result-art.round-art,
form.menubar-search .search-autocomplete li.result-item a > span.result-art.round-art img {
    border-radius: 50%;
}
form.menubar-search .search-autocomplete li.result-item a > span.result-art img {
    border: 1px solid rgba(0,0,0,0.10);
    height: 100%;
    width: 100%;
}
form.menubar-search .search-autocomplete li.result-item a > span.result-info {
    padding-left: 6px;
}
#menubar-wrapper form.menubar-search .search-autocomplete li.result-item a > span.result-info {
    width: 82%;
}
#header-wrapper form.menubar-search .search-autocomplete li.result-item a > span.result-info {
    width: 78%;
}
form.menubar-search .search-autocomplete li.result-item a > span.result-info div {
    overflow: hidden;
    text-overflow: ellipsis;
}
form.menubar-search .search-autocomplete li.result-item a > span.result-info cite {
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    font-style: normal;
}
form.menubar-search .search-autocomplete li.result-item a > span.result-info div.result-type {
    text-transform: uppercase;
}
body.search-active form.menubar-search.has-results .search-autocomplete li.result-item {
    display: none;
}
body.search-active form.menubar-search.has-results .search-autocomplete li.result-item:nth-child(-n+5) {
    display: list-item;
}
form.menubar-search:not(.pending) .search-autocomplete li:hover a,
form.menubar-search:not(.pending) .search-autocomplete li a:not(.selected):focus {
        opacity: 0.9;
}

/* SEE ALL TAB */
form.menubar-search .search-autocomplete li.results-see-all a,
form.menubar-search .search-autocomplete li.results-see-all.key-nav a,
.has-menubar.invertIconography #menubar.menubar-2018 #site-nav li.key-nav.results-see-all a:focus {
    background-color: #F3F3F3;
    color: #222;
    font-weight: 700;
}

/* GENRE TAB */
form.menubar-search .search-autocomplete.genre-match li.results-genre {
    display: list-item;
    background-color: #fff;
}
form.menubar-search .search-autocomplete li.results-genre a,
#site-nav form.menubar-search .search-autocomplete li.results-genre a.selected,
.has-menubar.invertIconography #menubar.menubar-2018 #site-nav li.results-genre.key-nav a:focus {
    color: #fff;
    background-color: #28a0c1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
#menubar #site-nav form.menubar-search .search-autocomplete li.results-genre a:not(.selected):focus {
    background-color: #28a0c1;
}

/* TAG TAB */
form.menubar-search .search-autocomplete li.results-tags {
    background-color: #fff;
    font-weight: 700;
}
form.menubar-search .search-autocomplete li.results-tags a > span,
form.menubar-search li.mobile-results-tags a > span {
    overflow: hidden;
    text-overflow: ellipsis;
}
form.menubar-search .search-autocomplete li.results-tags a,
#site-nav form.menubar-search .search-autocomplete li.results-tags a.selected,
.has-menubar.invertIconography #menubar.menubar-2018 #site-nav li.results-tags.key-nav a:focus {
    color: #fff;
    background-color: #333;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
#menubar #site-nav form.menubar-search .search-autocomplete li.results-tags a:not(.selected):focus {
    background-color: #333;
}

/* NO RESULTS */
body.search-active form.menubar-search .search-autocomplete .autocomplete-no-results {
    background-color: #fff;
    color: #222;
    font-size: 14px;
    white-space: normal;
    padding: 3px 20px;
    position: relative;
}
body.search-active form.menubar-search .search-autocomplete .autocomplete-no-results .noresults-header {
    font-weight: 500;
    margin-bottom: 3px;
}
body.search-active form.menubar-search .search-autocomplete .autocomplete-no-results .noresults-text {
    margin-top: 24px;
}
body.mobile-search-active form.menubar-search .search-autocomplete .autocomplete-no-results .tumbleweed {
    display: block;
}
body.mobile-search-active form.menubar-search .search-autocomplete .autocomplete-no-results .tumbleweed img {
    border: none;
    max-width: 100%;
}

/* MOBILE BODY */
body.mobile-search-fix.mobile-search-active {
    -ms-overflow-style: none;
    overflow: -moz-scrollbars-none;
    scrollbar-width: none;
    position: fixed;
    height: 100%;
    overflow: hidden;
}
body.mobile-search-active::-webkit-scrollbar,
form.menubar-search .menubar-search-icon {
    display: none;
}

/* MOBILE SEARCHBOX */
body.has-menubar-phone form.menubar-search,
.menubar-2018-phone-wrapper:not(.has-corp-header) .mobile-searchbar-2018.no-show {
    display: none;
}
.mobile-searchbar-2018 {
    visibility: visible;
    transition: visibility 0.1s, opacity .1s ease-in;
    border-radius: 3px;
    height: 42px;
    width: 100%;
    margin-bottom: 10px;
}
body.mobile-search-fix #menubar-2018-phone {
    z-index: 11;
}
body.mobile-search-active .mobile-searchbar-2018,
body.search-active .mobile-searchbar-2018 {
    position: absolute;
    left: 0;
    top: 0;
    width: 100vw;
}
@media (max-width:740px) {
    body.search-responsive .menubar-2018-phone-wrapper:not(.has-corp-header) .mobile-searchbar-2018 {
        position: absolute;
        left: 0;
        top: 0;
        width: 100vw;
    }
}
.mobile-searchbar-2018 form.menubar-search,
body.search-active #menubar-2018-phone form.menubar-search {
    display: block;
    width: 100%;
    z-index: 3;
    background: #fff;
}
body.search-active #menubar-2018-phone form.menubar-search {
    position: absolute;
    top: 0;
    width: 100vw;
    height: 100vh;
    left: 0;
}
body.search-active #menubar-2018-phone form.menubar-search input[type=text] {
    top: 10px;
    width: calc(100% - 123px);
    margin-left: 10px;
}
body:lang(ja).search-active #menubar-2018-phone form.menubar-search input[type=text] {
    width: calc(100% - 149px);
}
#menubar-2018-phone form.menubar-search input[type=text]:focus {
    box-shadow: none;
}
#menubar-2018-phone form.menubar-search input[type=text] {
    width: calc(100% - 47px);
    height: 38px;
    font-size: 16px;
}
body.search-active #menubar-2018-phone form.menubar-search.pending input[type=text] {
    padding: 0 35px 0 10px;
}
body.search-active #menubar-2018-phone form.menubar-search.pending .loading-icon {
    top: 21px;
    right: 78px;
}
body:lang(ja).search-active #menubar-2018-phone form.menubar-search.pending .loading-icon {
    right: 104px;
}
body.search-active #menubar-2018-phone .cancel-autocomplete {
    display: inline-block;
    top: 5px;
    right: 1px;
    text-align: center;
    cursor: pointer;
    font-size: 14px;
    padding: 15px 12px 15px 12px;
    color: #9B9B9B;
    position: absolute;
    z-index: 3;
}
#menubar-2018-phone form.menubar-search button.menubar-search-icon {
    right: 13px;
}
body.search-responsive #menubar-2018-phone form.menubar-search button.menubar-search-icon {
    display: block;
}
body.search-active #menubar-2018-phone form.menubar-search button.menubar-search-icon,
body.search-active #menubar-2018-phone form.menubar-search .genre-list {
    display: none;
}

body.mobile-search-fix #menubar-2018-phone form.menubar-search button.menubar-search-icon {
    top: 122px;
    right: 24px;
}
body.mobile-search-fix #menubar-2018-phone.fixed form.menubar-search button.menubar-search-icon {
    top: 72px;
}
body.mobile-search-fix:not(.special-banner-present) #menubar-2018-phone form.menubar-search button.menubar-search-icon,
body:lang(ja).mobile-search-fix #menubar-2018-phone form.menubar-search button.menubar-search-icon {
    top: 71px;
}
body.search-active.mobile-search-fix #menubar-2018-phone form.menubar-search.pending .loading-icon {
    top: 21px;
}
body.search-active.mobile-search-fix #menubar-2018-phone form.menubar-search {
    padding-top: 10px;
}
body.search-active.search-responsive form.menubar-search.has-results:not(.pending) .clear-autocomplete {
    position: absolute;
    text-align: center;
    cursor: pointer;
    font-size: 20px;
    color: #9B9B9B;
    padding-top: 4px;
}
@media (max-width:740px) {
    body.search-active.search-responsive form.menubar-search.has-results:not(.pending) .clear-autocomplete {
        display: block;
        top: 11px;
        right: 81px;
    }
    body:lang(ja).search-active.search-responsive form.menubar-search.has-results:not(.pending) .clear-autocomplete {
        right: 106px;
    }
}
body.search-active.mobile-search-fix #menubar-2018-phone form.menubar-search.has-results:not(.pending) .clear-autocomplete {
    display: block;
    top: 12px;
    right: 81px;
}
body:lang(ja).search-active.mobile-search-fix #menubar-2018-phone form.menubar-search.has-results:not(.pending) .clear-autocomplete {
    right: 107px;
}
/* MOBILE BACKGROUND */
body.search-active #menubar-2018-phone form.menubar-search .mobile-placeholder {
    display: inline-block;
    position: absolute;
    width: 100%;
    height: calc(100% - 51px);
    left: 0;
    bottom: 0;
    background: #fff;
    z-index: 1;
}
body.search-active #menubar-2018-phone form.menubar-search .mobile-placeholder p {
    font-family: Georgia, serif;
    font-size: 18px;
    font-style: italic;
    color: #9b9b9b;
    text-align: center;
    line-height: 1.5;
    margin: 159px auto;
    width: 200px;
}

/* MOBILE FILTERS */
body.search-active #menubar-2018-phone form.menubar-search.has-results ul.filter-list {
    margin-top: 9px;
    -ms-overflow-style: none;
    overflow: -moz-scrollbars-none;
    scrollbar-width: none;
}
body.search-active #menubar-2018-phone form.menubar-search.has-results ul.filter-list::-webkit-scrollbar {
    display: none;
}
body.search-active #menubar-2018-phone form.menubar-search.has-results ul.filter-list .filter-link.f {
    display: block;
}

/* MOBILE RESULTS */
#menubar-2018-phone form.menubar-search .search-autocomplete li.results-see-all,
#menubar-2018-phone form.menubar-search .search-autocomplete li.results-tags,
#menubar-2018-phone form.menubar-search .search-autocomplete li.results-genre {
    display: none;
}
body.search-active #menubar-2018-phone form.menubar-search.has-results .search-autocomplete {
    display: block;
    margin: 1px 0 0px -10px;
    width: 100vw;
    border: none;
    height: var(--mobile-results-height);
    overflow: scroll;
    top: 89px;
    background-color: #fff;
    box-shadow: none;
    -ms-overflow-style: none;
    overflow: -moz-scrollbars-none;
    scrollbar-width: none;
}
body.search-active.mobile-search-fix #menubar-2018-phone form.menubar-search.has-results .search-autocomplete {
    top: 99px;
}
body.search-active #menubar-2018-phone form.menubar-search.has-results .search-autocomplete::-webkit-scrollbar {
    display: none;
}
body.search-active #menubar-2018-phone form.menubar-search.has-results .search-autocomplete li.result-item {
    display: list-item;
}

body.search-active #menubar-2018-phone form.menubar-search.has-results .search-autocomplete li.result-item .result-info {
    max-width: var(--mobile-results-text-width);
}

/* MOBILE TAG */
body.search-active #menubar-2018-phone form.menubar-search.has-results .search-autocomplete.tag-room {
    height: var(--mobile-results-height-tag);
}
body.search-active #menubar-2018-phone form.menubar-search .mobile-results-tags:not(.no-show) {
    display: block;
    position: fixed;
    width: 100vw;
    bottom: 0px;
    background-color: #fff;
    font-weight: 700;
    height: 50px;
    font-size: 14px;
    left: 0;
    z-index: 2;
    margin-top: 0;
    margin-bottom: 0;
}
body.search-active #menubar-2018-phone form.menubar-search .mobile-results-tags:not(.no-show) a {
    color: #fff;
    background-color: #333;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* MOBILE RESPONSIVE DESKTOP */
@media (max-width:740px) {
    body.search-active.search-responsive {
    -ms-overflow-style: none;
    overflow: -moz-scrollbars-none;
    scrollbar-width: none;
    position: fixed;
    height: 100%;
    overflow: hidden;
    }
    body.search-active.search-responsive::-webkit-scrollbar {
        display: none;
    }
}

/* SPIN & PENDING */
/*******spin*******/
@keyframes lazy-load {
    to {
        width: 16px;
        height: 16px;
        overflow: hidden;
        visibility: visible;
    }
}
.pending .loading-icon {
    opacity: 1;
    animation: 250ms ease-in 0s forwards lazy-load;
    top: 22px;
}
.loading-icon {
    position: absolute;
    width: 16px;
    height: 16px;
    overflow: hidden;
    opacity: 0;
}
.loading-icon .search-spinner{
    margin: auto;
    animation-name: spin;
    animation-duration: 1s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    transform-origin: center center;
}
@keyframes spin {
    from {
        transform: rotate(360deg);
    } to {
        transform: rotate(0deg);
    }
}
#search-spinner .st1 {
    fill: #606463;
}
#search-spinner .st2 {
    fill: #717474;
}
#search-spinner .st3 {
    fill: #7C7F7E;
}
#search-spinner .st4 {
    fill: #8D8F8F;
}
#search-spinner .st5 {
    fill: #BBBAB9;
}
#search-spinner .st6 {
    fill: #D2D2D1;
}
#search-spinner .st7 {
    fill: #DCDCDC;
}
#search-spinner .st8 {
    fill: #A4A4A5;
}
/*******pending*******/
form.menubar-search.pending .genre-list li,
form.menubar-search.pending .filter-list .filter-link,
form.menubar-search.pending.has-results .search-autocomplete .result-item,
form.menubar-search.pending.has-results .search-autocomplete .simple,
form.menubar-search.pending.has-results .mobile-results-tags,
form.menubar-search.pending.has-results .search-autocomplete .autocomplete-no-results {
    opacity: 0.5;
}
form.menubar-search.pending .search-autocomplete {
    background-color: #fff;
}
body.search-active #menubar-2018-phone form.menubar-search.has-results.pending .search-autocomplete {
    overflow: hidden;
}
form.menubar-search.pending li.simple,
form.menubar-search.pending li.simple a,
form.menubar-search.pending .result-item a,
form.menubar-search.pending .filter-link {
    cursor: default;
}

/* DARK MODE */
.invertIconography #menubar.menubar-2018 form.menubar-search input[type=text],
.invertIconography #menubar.menubar-2018 form.menubar-search input[type=text].focused {
    background-color: rgba(255,255,255,0.1);
    color: rgba(255,255,255,0.7);
    border: none;
}

.invertIconography #menubar.menubar-2018 button.menubar-search-icon {
    fill: #fff;
}

.has-menubar.invertIconography #menubar.menubar-2018 form.menubar-search .search-autocomplete .result-item a,
.has-menubar.invertIconography #menubar.menubar-2018 form.menubar-search .search-autocomplete .results-see-all a {
    color: #222;
}