.text-red { color: red } .text-orange { color: #ff9d32 } .text-lightGreen { color: #47d25a } .text-green { color: #00b24f } .hits-btn { width: 100%; font-family: RobotoRegular; color: #36b0e3; border: 2px solid #36b0e3; border-radius: 30px; text-align: center; text-decoration: none; padding: 10px 0; background-color: transparent } .hits-btn:hover { color: #fff; background-color: #1eade9 } .overlay-back-to-top { background-color: #fff; border: 1px solid #ddd; border-radius: 1px; bottom: 20px; height: 70px; line-height: 1.2; padding: 6px 10px; position: fixed; right: 30px; opacity: 1; text-align: center; width: 60px; z-index: 999; -webkit-transition: all .2s ease-out; -moz-transition: all .2s ease-out; -o-transition: all .2s ease-out; transition: all .2s ease-out; color: #36b0e3 } .overlay-back-to-top.hide { right: -30px; opacity: 0 } .current-refine-container { transition: max-height .25s ease-in-out; -webkit-transition: max-height .25s ease-in-out; margin: 2.4rem 0 1.5rem; padding: 1.5rem } .current-refine-container .current-refine-title { font-size: 1.8rem; color: #333 } .current-refine-container .refine-btn-container { margin: .8rem 0 0; padding: .8rem 0 0 } .current-refine-container .refine-btn-container .refine-btn-tags { background-color: #42b74b; padding: 10px 15px 7px; margin: 0 1.5rem 1.5rem 0; color: #fff; font-family: RobotoRegular; font-size: 14px; border-radius: 5px } .current-refine-container .refine-btn-container .refine-btn-tags:hover { color: #fff; opacity: .8; text-decoration: none } .current-refine-container .refine-btn-container .refine-btn-tags span { font-size: 1.6rem; } .current-refine-container .refine-btn-container .refine-btn-tags span:last-child { margin: 0 0 0 1.5rem; pointer-events: none } .current-refine-container .refine-btn-container .refine-btn-tags span:last-child:before { line-height: 10px; font-size: 1rem; position: relative; top: -2px } .overlay-search-container .overlay-search-result .overlay-filter--content__items .overlay-filter-container .checkbox-content--item__box { display: none } .overlay-search-container .overlay-search-result .overlay-filter--content__items .overlay-filter-container .checkbox-content--item__box:checked + .checkbox-content--item__trigger { background-color: #42b74b } .overlay-search-container .overlay-search-result .overlay-filter--content__items .overlay-filter-container .checkbox-content--item__trigger { display: inline-block; width: 18px; height: 18px; border: 1px solid #dbdbdb; border-radius: 5px; vertical-align: middle; margin: 0 15px 5px 0; background-color: #fff; cursor: pointer } .overlay-search-container .overlay-search-result .overlay-filter--age-container .minAge.active, .overlay-search-container .overlay-search-result .overlay-filter--age-container .maxAge.active { background-color: #42b74b; color: #fff } .overlay-search-container { width: 100%; height: 100vh; position: fixed; left: 0; top: 0; background-color: rgba(255, 255, 255, .95); z-index: 2022; display: none; overflow-y: scroll; overflow-x: hidden; scroll-behavior: smooth } .overlay-search-container.open { display: block; -webkit-animation: showFadeIn .15s ease-in; animation: showFadeIn .15s ease-in } .overlay-search-container.reopen { display: block; opacity: 1; z-index: 3000 } .overlay-search-container .overlay-search-bar-container { width: 100%; height: 112px; background-color: #000; display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center; position: sticky; top: 0; z-index: 1 } .overlay-search-container .overlay-search-bar-container .overlay-search-bar { max-width: 1300px; width: 100%; margin: 0 auto; position: relative } .overlay-search-container .overlay-search-bar-container .overlay-search-bar .overlay-search-bar-border { position: absolute; bottom: 0; left: 36px; font-size: 30px; font-family: RobotoLight; max-width: 1250px; border-bottom: 2px solid #2c9f3c; height: 0; overflow: hidden } .overlay-search-container .overlay-search-bar-container .overlay-search-bar input { max-width: 1250px; width: 100%; background: 0 0; color: #fff; font-size: 30px; height: 50px; font-family: RobotoLight; border: none; border-bottom: 2px solid #555; padding: 1px 40px 5px 36px; position: relative } .overlay-search-container .overlay-search-bar-container .overlay-search-bar input:after { content: ""; position: absolute; bottom: 0; left: 0; border-bottom: 1px solid red } .overlay-search-container .overlay-search-bar-container .overlay-search-bar input::placeholder { font-size: 2.2rem; color: #888; font-family: RobotoLight } .overlay-search-container .overlay-search-bar-container .overlay-search-bar .left-arrow, .overlay-search-container .overlay-search-bar-container .overlay-search-bar .close-icon { position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); cursor: pointer; z-index: 1 } .overlay-search-container .overlay-search-bar-container .overlay-search-bar .left-arrow:before { font-size: 26px; color: #2c9f3c } .overlay-search-container .overlay-search-bar-container .overlay-search-bar .close-icon { position: absolute; top: 50%; right: 0; bottom: 0; background-color: transparent; border: none; width: 40px; height: 50px } .overlay-search-container .overlay-search-bar-container .overlay-search-bar .close-icon { display: none } .overlay-search-container .overlay-search-bar-container .overlay-search-bar .close-icon .ais-SearchBox-resetIcon { stroke: #666; fill: #666; width: 10px; height: 10px } .overlay-search-container .overlay-search-bar-container .overlay-search-bar .close-icon.visible { display: block } .overlay-search-container .overlay-search-sample ul { max-width: 1300px; padding: 0 10px 10px; display: flex; display: -webkit-flex; margin: 2rem auto 0 } .overlay-search-container .overlay-search-sample li { width: 25%; padding: 10px 0; display: flex; display: -webkit-flex; flex-direction: column; -webkit-flex-direction: column; justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center } .overlay-search-container .overlay-search-sample li .search-sample-img-container { width: 100px; line-height: 58px; margin: 10px auto 8px; background-color: transparent; display: inline-block; vertical-align: middle; text-align: center } .overlay-search-container .overlay-search-sample li img { max-width: 100% } .overlay-search-container .overlay-search-sample li span:nth-child(2) { color: #999; font-size: 18px; font-family: RobotoRegular } .overlay-search-container .overlay-search-sample li span:nth-child(3) { color: #999; font-size: 18px; font-family: RobotoLight } .overlay-search-container .overlay-search-sample li span:nth-child(4) { color: #b9b9b9; font-size: 14px; font-family: RobotoLight } .overlay-search-container .overlay-search-result { max-width: 1300px; width: 100%; height: 100%; margin: 2rem auto 0; padding: 0 1.5rem; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between } .overlay-search-container .overlay-search-result .overlay-filter { width: 30%; background-color: hsla(0, 0%, 88.6%, .18); padding: 0 1.5rem } .overlay-search-container .overlay-search-result .overlay-filter.sticky { position: fixed; height: 100vh; z-index: 1; max-width: 390px } .overlay-search-container .overlay-search-result .overlay-result { width: 68.5% } .overlay-search-container .overlay-search-result .overlay-result.activeSticky { margin-left: auto; width: 67.5% } .overlay-search-container .overlay-search-result .overlay-result .current-refine-container { background-color: hsla(0, 0%, 88.6%, .18); margin: 0 0 1.5rem; display: none } .overlay-search-container .overlay-search-result .overlay-result .current-refine-container.notEmpty { display: block } .result-stats { margin: 0 0 1.5rem; padding: 1.5rem; background-color: hsla(0, 0%, 88.6%, .18) } .result-stats .search-results-header p { font-size: 1.6rem; font-family: RobotoBold; margin: 0 } .result-stats .search-results-header span:nth-child(2) { font-family: RobotoMedium } .result-stats p { margin: 0 } .result-stats .search-results-header span:first-child { font-family: RobotoMedium } .result-stats .search-results-header span:last-child { color: #999 } .overlay-search-container .overlay-search-result .overlay-filter .current-refine-container { display: none } .overlay-search-container .overlay-search-result .overlay-filter .current-refine-container.notEmpty { display: none } .overlay-search-container .overlay-search-result .overlay-filter .result-stats { display: none } .overlay-search-container .overlay-search-result .overlay-filter .filter-selector { position: relative; width: 100%; height: 34px; border: 1px solid #ccc; border-radius: 20px; overflow: hidden; text-align: center; display: none } .overlay-search-container .overlay-search-result .overlay-filter .filter-selector .filter-category { width: 32%; display: inline-block; height: 100%; line-height: 32px; color: #1eade9; font-family: RobotoMedium; font-size: 14px; cursor: pointer } .overlay-search-container .overlay-search-result .overlay-filter .filter-selector .filter-category:nth-child(2) { border-left: 1px solid #ccc; border-right: 1px solid #ccc } .overlay-search-container .overlay-search-result .overlay-filter .filter-selector .filter-category.active { color: #fff } .overlay-search-container .overlay-search-result .overlay-filter .filter-selector .filter-category-selector { position: absolute; left: 0; top: 0; background-color: #1eade9; height: 100%; z-index: -1; transition: right .5s ease-in, left .5s ease-out } .overlay-search-container .overlay-search-result .overlay-filter .filter-selector .selector { position: absolute; display: block; height: 34px; background-color: #1eade9; z-index: -1; top: 0 } .overlay-search-container .overlay-search-result .overlay-filter .overlay-filter--content .hits-btn { margin: 1.5rem auto 0; display: none; max-width: 189px; width: 100% } .overlay-search-container .overlay-search-result .overlay-filter .overlay-filter--content .hits-btn.show { display: block } .overlay-search-container .overlay-search-result .overlay-filter--state .result-subheader, .overlay-search-container .overlay-search-result .overlay-filter--city .result-subheader, .overlay-search-container .overlay-search-result .overlay-filter--age .result-subheader { font-size: 1.8rem; font-family: RobotoRegular; color: #333 } .overlay-search-container .overlay-search-result .overlay-filter-container { margin: 1.4rem 0 0 } .overlay-search-container .overlay-search-result .overlay-filter--state .filter-search-box, .overlay-search-container .overlay-search-result .overlay-filter--city .filter-search-box, .overlay-search-container .overlay-search-result .overlay-filter--age-container { width: 100%; position: relative; padding: 0 1.5rem; margin: .7rem 0 0 } .overlay-search-container .overlay-search-result .overlay-filter--state .filter-search-box i, .overlay-search-container .overlay-search-result .overlay-filter--city .filter-search-box i { position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); color: #2c9f3c; font-size: 2rem; left: 27px } .overlay-search-container .overlay-search-result .overlay-filter--state .filter-search-box input, .overlay-search-container .overlay-search-result .overlay-filter--city .filter-search-box input { max-width: 330px; width: 100%; padding: 1rem .5rem 1rem 4rem; border: 1px solid #dbdbdb; font-size: 1.4rem; border-radius: 5px } .overlay-search-container .overlay-search-result .overlay-filter--state .filter-search-box input::-webkit-input-placeholder, .overlay-search-container .overlay-search-result .overlay-filter--city .filter-search-box input::-webkit-input-placeholder { font-family: RobotoLight; font-size: 1.6rem } .overlay-search-container .overlay-search-result .overlay-filter--state .checkbox-content, .overlay-search-container .overlay-search-result .overlay-filter--city .checkbox-content { max-height: 160px; min-height: auto; padding: 0 1.5rem; margin: 2.2rem 1.5rem 0 0; overflow: hidden; overflow-y: scroll } .overlay-search-container .overlay-search-result .overlay-filter--state .checkbox-content::-webkit-scrollbar, .overlay-search-container .overlay-search-result .overlay-filter--city .checkbox-content::-webkit-scrollbar { width: .2rem } .overlay-search-container .overlay-search-result .overlay-filter--state .checkbox-content::-webkit-scrollbar-track, .overlay-search-container .overlay-search-result .overlay-filter--city .checkbox-content::-webkit-scrollbar-track { background-color: #fff; outline: 1px solid rgba(153, 153, 153, .3) } .overlay-search-container .overlay-search-result .overlay-filter--state .checkbox-content::-webkit-scrollbar-thumb, .overlay-search-container .overlay-search-result .overlay-filter--city .checkbox-content::-webkit-scrollbar-thumb { background-color: #a9a9a9 } .overlay-search-container .overlay-search-result .overlay-filter--state .checkbox-content--item, .overlay-search-container .overlay-search-result .overlay-filter--city .checkbox-content--item { margin: 0 0 1.2rem; cursor: pointer } .overlay-search-container .overlay-search-result .overlay-filter--state .checkbox-content--item__box, .overlay-search-container .overlay-search-result .overlay-filter--city .checkbox-content--item__box { width: 18px; height: 18px; border: 1px solid #dbdbdb; border-radius: 5px; background-color: #fff; margin: 0 1.5rem 0 0; display: inline-block; vertical-align: middle; cursor: pointer } .overlay-search-container .overlay-search-result .overlay-filter--state .checkbox-content--item__label, .overlay-search-container .overlay-search-result .overlay-filter--city .checkbox-content--item__label { color: #666; font-family: RobotoLight; cursor: pointer } .overlay-search-container .overlay-search-result .overlay-filter--age-container { width: 100%; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; align-items: center; -webkit-align-items: center } .overlay-search-container .overlay-search-result .overlay-filter--age-container .maxAge, .overlay-search-container .overlay-search-result .overlay-filter--age-container .minAge { width: 40%; height: 40px; font-family: RobotoLight; font-size: 16px; color: #666; border: 1px solid #dbdbdb } .overlay-search-container .overlay-search-result .overlay-filter--age-container p { margin: 0 } .overlay-search-container .overlay-result #searchResults .hits-profiles--card { padding: 1.5rem; margin: 0 0 1.5rem; background-color: hsla(0, 0%, 88.6%, .18); position: relative } .overlay-search-container .overlay-result #searchResults .hits-profiles--card__header { display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center; margin: 0 0 2rem } .overlay-search-container .overlay-result #searchResults .hits-profiles--card__header img { width: 43px; height: 43px; margin: 0 1.5rem 0 0; border-radius: 50% } .overlay-search-container .overlay-result #searchResults .hits-profiles--card__header--info a { text-decoration: none; font-family: RobotoRegular; font-size: 2rem } .overlay-search-container .overlay-result #searchResults .hits-profiles--card__header--info a:hover { text-decoration: underline } .overlay-search-container .overlay-result #searchResults .hits-profiles--card__header--info p { margin: 0; font-family: RobotoLight; font-size: 1.6rem } .overlay-search-container .overlay-result #searchResults .hits-profiles--card__body .content-left { width: 55% } .overlay-search-container .overlay-result #searchResults .hits-profiles--card__body .content-left .hits-extra-info, .overlay-search-container .overlay-result #searchResults .hits-profiles--card__body .content-left .hits-alert { margin: 0 0 .7rem; text-overflow: ellipsis; white-space: nowrap; overflow: hidden } .overlay-search-container .overlay-result #searchResults .hits-profiles--card__body .content-left .hits-alert span:last-child { font-family: RobotoRegular } .overlay-search-container .overlay-result #searchResults .hits-profiles--card__body .content-left .hits-extra-info .hit-divider { color: #999; font-family: RobotoRegular } .overlay-search-container .overlay-result #searchResults .hits-profiles--card__body .content-left .hits-extra-info .hit-aka--label { color: #777 } .overlay-search-container .overlay-result #searchResults .hits-profiles--card__body .content-left .hits-extra-info .hit-aka--label, .overlay-search-container .overlay-result #searchResults .hits-profiles--card__body .content-left .hits-alert .hit-aka--label { font-size: 1.6rem; font-family: RobotoMedium } .overlay-search-container .overlay-result #searchResults .hits-profiles--card__body .content-left .hits-extra-info .hit-values { font-size: 1.6rem; color: #333; text-transform: capitalize; font-family: RobotoRegular } .overlay-search-container .overlay-result #searchResults .hits-profiles--card__body .content-right { width: 45%; position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); right: 0 } .overlay-search-container .overlay-result #searchResults .hits-profiles--card__body .content-right .hits-view-btn { max-width: 243px; margin: 0 1.5rem 15px auto; font-size: 1.6rem; display: block } @media screen and (max-width: 991px) { .overlay-search-container .overlay-search-result { flex-direction: column; -webkit-flex-direction: column } .overlay-search-container .overlay-search-result .overlay-filter .current-refine-container.notEmpty { display: block } .overlay-search-container .overlay-search-result .overlay-filter { width: 100%; margin: 0 0 1.5rem; padding: 0 0 1.5rem } .overlay-search-container .overlay-search-result .overlay-filter.sticky { height: initial; max-width: 942px; background-color: #e2e2e2; margin-top: -2rem; padding: 1.5rem; max-width: initial; width: 98%; left: 0 } .overlay-search-container .overlay-search-result .overlay-filter-container { display: none } .overlay-search-container .overlay-search-result .overlay-filter-container.show { display: block } .overlay-search-container .overlay-search-result .overlay-filter .filter-selector { display: block } .overlay-search-container .overlay-search-result .overlay-filter .result-stats { display: block } .overlay-search-container .overlay-search-result .overlay-filter--content__items { max-height: 0; overflow-y: hidden; transition: max-height .25s ease-in-out; -webkit-transition: max-height .25s ease-in-out } .overlay-search-container .overlay-search-result .overlay-filter--content__items.show { max-height: 230px } .overlay-search-container .overlay-search-result .overlay-result { width: 100%; padding: 0 } .overlay-search-container .overlay-search-result .overlay-result.activeSticky { width: 100%; margin-top: 260px } .overlay-search-container .overlay-search-result .overlay-result .current-refine-container { display: none } .overlay-search-container .overlay-search-result .overlay-result .current-refine-container.notEmpty { display: none } .overlay-search-container .overlay-search-result .overlay-result .overlay-filter { display: none } .overlay-search-container .overlay-search-result .overlay-filter .overlay-filter--content .hits-btn { font-size: 1.6rem } .overlay-search-container .overlay-search-result .overlay-filter--state .result-subheader, .overlay-search-container .overlay-search-result .overlay-filter--city .result-subheader, .overlay-search-container .overlay-search-result .overlay-filter--age .result-subheader { display: none } .overlay-search-container .overlay-search-result .overlay-filter--state .filter-search-box, .overlay-search-container .overlay-search-result .overlay-filter--city .filter-search-box { padding: 0 } .overlay-search-container .overlay-search-result .overlay-filter--state .filter-search-box i, .overlay-search-container .overlay-search-result .overlay-filter--city .filter-search-box i { left: 10px } .overlay-search-container .overlay-search-result .overlay-filter--state .filter-search-box input, .overlay-search-container .overlay-search-result .overlay-filter--city .filter-search-box input { max-width: initial } .overlay-search-container .overlay-search-result .overlay-filter--age-container { max-width: 450px; margin: 3rem 0 1.5rem } .overlay-search-container .overlay-search-result .overlay-result .result-stats { display: none } .result-stats .search-results-header span, .result-stats p { font-size: 1.6rem } .overlay-search-container .overlay-result #searchResults .hits-profiles--card__header--info a { font-size: 1.6rem } .overlay-search-container .overlay-result #searchResults .hits-profiles--card__header--info p, .overlay-search-container .overlay-result #searchResults .hits-profiles--card__body .content-left .hits-extra-info .hit-aka--label, .overlay-search-container .overlay-result #searchResults .hits-profiles--card__body .content-left .hits-extra-info .hit-values, .overlay-search-container .overlay-result #searchResults .hits-profiles--card__body .content-left .hits-alert .hit-aka--label { font-size: 1.4rem } .overlay-search-container .overlay-result #searchResults .hits-profiles--card__body .content-right { position: initial; width: 100%; transform: initial; -webkit-transform: initial } .overlay-search-container .overlay-result #searchResults .hits-profiles--card__body .content-left { width: 100% } .overlay-search-container .overlay-result #searchResults .hits-profiles--card__body .content-left .hits-extra-info, .overlay-search-container .overlay-result #searchResults .hits-profiles--card__body .content-left .hits-alert { margin: 0; font-size: 1.6rem } .overlay-search-container .overlay-result #searchResults .hits-profiles--card__body .content-right .hits-view-btn { margin: 1rem auto 0; max-width: 330px } } @media screen and (max-width: 768px) { .overlay-search-container { background-color: #fff } .overlay-search-container .overlay-search-bar-container { height: 60px } .overlay-search-container .overlay-search-bar-container .overlay-search-bar input { border-bottom: 0 solid #999 } .overlay-search-container .overlay-search-bar-container .overlay-search-bar input::placeholder { font-size: 1.9rem } .overlay-search-container .overlay-search-sample ul { flex-direction: column; -webkit-flex-direction: column; margin: 4rem 0 0 } .overlay-search-container .overlay-search-sample ul li { width: 100%; flex-direction: row; -webkit-flex-direction: row; justify-content: flex-start; -webkit-justify-content: flex-start; padding: 0 } .overlay-search-container .overlay-search-sample li .search-sample-img-container { width: 35px; margin: 0 5px 0 0; line-height: 50px } .overlay-search-container .overlay-search-sample li .search-sample-img-container img { max-width: 75% } .overlay-search-container .overlay-search-sample li span:nth-child(2), .overlay-search-container .overlay-search-sample li span:nth-child(3) { font-size: 1.2rem } .overlay-search-container .overlay-search-sample li span:nth-child(4) { font-size: 1.1rem } .overlay-search-container .overlay-search-result .overlay-filter.sticky { width: 100% } } @media screen and (max-width: 576px) { .current-refine-container .current-refine-title { display: none } .overlay-search-container .overlay-search-result .overlay-filter.sticky .filter-selector { margin: 0 0 1rem } .overlay-search-container .overlay-search-result .overlay-filter.sticky { padding: 0 1rem } .overlay-search-container .overlay-search-result .overlay-filter.sticky .result-stats { padding: 1rem 0 0 } .overlay-search-container .overlay-search-result .overlay-filter .current-refine-container { margin: 0; padding: 0 1.5rem } .overlay-search-container .overlay-search-result .overlay-filter.sticky .current-refine-container { margin: 0; padding: 0 0 1.5rem } .overlay-search-container .overlay-search-result .overlay-filter.sticky .overlay-filter--content .hits-btn { margin: 1.5rem auto } } @-webkit-keyframes showFadeIn { from { opacity: 0; z-index: -1 } to { opacity: 1; z-index: 3000 } } @keyframes showFadeIn { from { opacity: 0; z-index: -1 } to { opacity: 1; z-index: 3000 } }