/** @mixin  vendorize   Pre-prends non-standardized CSS rules with vendor prefixes.      @param     $property   The CSS property name. @param   $value      The CSS property value. */
/** @mixin  transition  Generates CSS transition declarations.   @param     $property   The CSS property to interpolate. @param     $duration   The transition duration (in seconds). @param    $easing     The easing function (linear, ease-out, etc). @param     $delay      The easing delay (in seconds). */
/** @mixin  rounded-list    Styles a list's items to give the list a rounded border.  @param    $border-width   The border width (in pixels). @param    $boder-radius   The border radius (in pixels). */
/** @mixin  frosted     Sets opqueness of an element, with backdrop blur.  @param   $opaqueness     Value between 0 and 1.   */
/** @mixin  sticky  Sticks an element to a certain height relative to the document.  @param     $top    A position (height) where the element will stick. */
/** @mixin  search-tag  Decorates selections with search tag styles.      @TODO(mzalla) Convert to @extend directive (if possible). */
#search ul {
    margin: 0;

    list-style-type: none;
}
#search .sticky {
    position: relative;
    position: -webkit-sticky;
    position:    -moz-sticky;
    position:     -ms-sticky;
    position:      -o-sticky;
    position:         sticky;
    z-index: 9;
    z-index: 2 !important;
    top: 0 !important;

    opacity: .92;

    backdrop-filter: blur(22.08px);
}
#search .frozen {
    cursor: auto !important;
    pointer-events: none !important;

    opacity: .35 !important;
}
#search .bg-light {
    background-color: #f9f9f9;
}
#search .search-tag {
    font-size: 15px;

    display: inline-block;

    padding: .35em 1em .15em;

    -webkit-transition: all .35s ease-in-out 0s;
       -moz-transition: all .35s ease-in-out 0s;
         -o-transition: all .35s ease-in-out 0s;
            transition: all .35s ease-in-out 0s;

    color: #999;
    border: 1px solid #cdcdcd;
    border-radius: 4px;
}
#search .search-tag.active {
    color: white;
    border-color: #51a7f9;
    background-color: #51a7f9;
}
#search .hero {
    z-index: 2;
}
#search .hero > [class*='col-'] {
    padding-bottom: .65em;
}
#search .hero input.search-field {
    padding-left: 40px;

    background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjxzdmcgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCINCgl3aWR0aD0iMTlweCIgaGVpZ2h0PSIxOXB4IiB2aWV3Qm94PSIwIDAgMTkgMTkiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDE5IDE5IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCgk8cGF0aCBmaWxsPSIjNjY2NjY2IiBkPSJNMTcuNjMyLDE2Ljk1NWwtNC43NjEtNC43NjJjMS4xMDktMS4xODgsMS43OTUtMi43NzYsMS43OTUtNC41MjdjMC0zLjY2Ny0yLjk4Mi02LjY0OS02LjY0OS02LjY0OQ0KCQljLTMuNjY3LDAtNi42NDksMi45ODItNi42NDksNi42NDhjMCwzLjY2NywyLjk4Miw2LjY0Nyw2LjY0OSw2LjY0N2MxLjM5MSwwLDIuNjgyLTAuNDMyLDMuNzUtMS4xNjRsNC44MzQsNC44MzRMMTcuNjMyLDE2Ljk1NXoNCgkJTTIuODI0LDcuNjY2YzAtMi44NjMsMi4zMy01LjE5Miw1LjE5Mi01LjE5MmMyLjg2NCwwLDUuMTkyLDIuMzI5LDUuMTkyLDUuMTkyYzAsMi44NjEtMi4zMjgsNS4xOTEtNS4xOTIsNS4xOTENCgkJQzUuMTU0LDEyLjg1NSwyLjgyNCwxMC41MjcsMi44MjQsNy42NjZ6Ii8+DQoJPC9zdmc+');
    background-repeat: no-repeat;
    background-position: 12px 50%;
    background-size: 19px 19px;
}
#search .hero input.search-field:focus {
    box-shadow: none;
}
#search .hero ul.suggested-search-queries {
    position: absolute;

    overflow: hidden;

    width: 100%;
    max-height: 0;
    margin-top: -3px;
    padding: 0 2em 0 0;

    -webkit-transition: all .35s ease-in-out 0s;
       -moz-transition: all .35s ease-in-out 0s;
         -o-transition: all .35s ease-in-out 0s;
            transition: all .35s ease-in-out 0s;
}
#search .hero ul.suggested-search-queries li {
    border-style: solid;
    border-color: #ccc;
    border-top-width: 0;
    border-right-width: 1px;
    border-bottom-width: 0;
    border-left-width: 1px;
}
#search .hero ul.suggested-search-queries li:first-child {
    border-top-width: 1px;
}
#search .hero ul.suggested-search-queries li:last-child {
    border-bottom-width: 1px;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
}
#search .hero ul.suggested-search-queries.visible {
    max-height: 320px;
}
#search .hero li.suggested-search-query {
    font-size: 1.02em;

    position: relative;
    z-index: 999;

    overflow: auto;

    padding: .5em .6em;

    cursor: pointer;
    white-space: nowrap;

    color: #333;
    background-color: white;
}
#search .hero li.suggested-search-query:hover {
    background-color: #f2f2f2;
}
#search .hero li.suggested-search-query.selected {
    background-color: #dedede;
}
#search .tab-menu ul.tabs {
    position: relative;

    overflow: hidden;

    width: 100%;
    margin: 0 auto -1px;
    padding: .75em 0;

    white-space: nowrap;
}
@media screen and (min-device-width: 320px) and (max-device-width: 767px) {
    #search .tab-menu ul.tabs {
        overflow-x: scroll;
    }
}
#search .tab-menu li.tab {
    font-size: 16px;
    font-weight: 400;

    display: inline-block;

    margin: 0 22px 0 0;
}
@media screen and (min-device-width: 320px) and (max-device-width: 568px) {
    #search .tab-menu li.tab {
        margin-right: 16px;
    }
}
#search .tab-menu li.tab a {
    padding: 0 0 .75em;

    color: #888;
}
#search .tab-menu li.tab a:hover {
    text-decoration: none;

    color: #333;
}
#search .tab-menu li.tab.active a {
    font-weight: 700;

    color: #333;
    border-bottom: 3px solid #51a7f9;
}
#search .filters-summary,
#search .results-summary {
    display: inline-block;
    overflow: hidden;

    margin-bottom: .85em;

    white-space: nowrap;
    text-overflow: ellipsis;
}
#search .filters-summary * {
    vertical-align: top;
}
#search .filters-summary .filters-clear {
    width: 14px;
    min-height: 14px;
    margin-top: .225em;
    margin-left: .35em;

    border-radius: 7px;
    background-color: #51a7f9;
    background-image: url('../img/clear-icon.svg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: auto 100%;
}
@media screen and (min-device-width: 320px) and (max-device-width: 480px) {
    #search .filters-summary {
        max-width: 200px;
    }
}
@media screen and (min-device-width: 320px) and (max-device-width: 568px) {
    #search .filters-summary {
        max-width: 200px;
    }
}
@media screen and (min-device-width: 375px) and (max-device-width: 667px) {
    #search .filters-summary {
        max-width: 250px;
    }
}
@media screen and (min-device-width: 768px) and (max-device-width: 1023px) {
    #search .filters-summary {
        max-width: 568px;
    }
}
@media screen and (min-device-width: 320px) and (max-device-width: 767px) {
    #search .results-summary span {
        display: none;
    }
}
#search .toggle-filter-menu {
    font-size: .725rem;

    height: 16px;
    margin-top: .3em;
    padding-left: 22.5px;

    cursor: pointer;
    -webkit-transition: all .35s ease-in-out 0s;
       -moz-transition: all .35s ease-in-out 0s;
         -o-transition: all .35s ease-in-out 0s;
            transition: all .35s ease-in-out 0s;
    letter-spacing: 1px;

    border: none;
    outline: none;
    background-color: transparent;
    background-image: url('../img/icon-filter.svg');
    background-repeat: no-repeat;
    background-position: left center;
    background-size: auto 75%;
}
#search .toggle-filter-menu.frozen {
    opacity: 0 !important;
}
#search .toggle-filter-menu:not(.active):not(:hover) {
    opacity: .5;
}
#search ul.filter-sets {
    display: block;
    clear: both;
    overflow: hidden;

    max-height: 125vh;

    -webkit-transition: all .24s ease-in-out 0s;
       -moz-transition: all .24s ease-in-out 0s;
         -o-transition: all .24s ease-in-out 0s;
            transition: all .24s ease-in-out 0s;
}
#search ul.filter-sets:not(.visible) {
    max-height: 0;
}
@media screen and (min-device-width: 768px) {
    #search ul.filter-sets {
        max-height: 282px;
    }
}
#search li.filter-set {
    margin-bottom: .65em;
}
@media screen and (min-device-width: 320px) and (max-device-width: 767px) {
    #search li.filter-set {
        margin-bottom: 0;
    }
    #search li.filter-set:not(:first-child) {
        margin-top: .85em;
        padding-top: .75em;

        border-top: 1px solid #e6e6e6;
    }
    #search li.filter-set:last-child {
        margin-bottom: 1.5em;
    }
}
#search li.filter-set .filter-set-label {
    margin-bottom: .4em;
}
#search li.filter-set input[type='checkbox'] {
    margin: 0 .6em 0 0;
}
#search li.filter-option label {
    display: block;

    margin-right: .28em;
    margin-bottom: .4em;
}
#search li.filter-option label .search-tag {
    cursor: pointer;
}
@media screen and (min-device-width: 320px) and (max-device-width: 767px) {
    #search li.filter-option {
        margin-bottom: .6em;
    }
    #search li.filter-option:last-child {
        margin-bottom: 1.35em;
    }
    #search li.filter-option label .search-tag {
        font-size: 1.15rem;
        font-weight: 600;

        padding: .35em 1.15em .2em;
    }
}
@media screen and (min-device-width: 768px) {
    #search li.filter-option {
        display: inline-block;
    }
}
#search li.filter-option input[type='checkbox'] {
    display: none;
}
#search .loading {
    padding: 2.5em 0 1.92em 0;

    opacity: .5;
}
@media screen and (min-device-width: 320px) and (max-device-width: 767px) {
    #search .loading {
        text-align: center !important;
    }
}
#search .search-message,
#search .filter-message {
    color: #999;
}
@media screen and (min-device-width: 768px) and (max-device-width: 1023px) {
    #search .search-results {
        width: 100%;
    }
}
#search .search-result {
    margin-bottom: 1em;
}
#search .search-result .result-title,
#search .search-result .result-description {
    margin-bottom: .4em;
}
@media screen and (min-device-width: 320px) and (max-device-width: 767px) {
    #search .search-result .result-title,
    #search .search-result .result-description {
        word-wrap: break-word;
    }
}
#search .search-result .result-title {
    line-height: 1.25;
}
#search .search-result li.result-tag {
    font-size: 15px;
    font-size: 11px;
    font-weight: 600;

    display: inline-block;

    margin-right: .35em;
    margin-bottom: .45em;
    padding: .35em 1em .15em;
    padding: .25em .7em .05em;

    -webkit-transition: all .35s ease-in-out 0s;
       -moz-transition: all .35s ease-in-out 0s;
         -o-transition: all .35s ease-in-out 0s;
            transition: all .35s ease-in-out 0s;
    letter-spacing: .015em;

    color: #999;
    color: #999;
    border: 1px solid #cdcdcd;
    border-color: transparent;
    border-radius: 4px;
    background-color: rgba(220, 222, 224, .35);
}
#search .search-result li.result-tag.active {
    color: white;
    border-color: #51a7f9;
    background-color: #51a7f9;
}
#search .search-result li.result-tag.event {
    margin-right: .1em;
}
#search .search-result.child {
    margin: 1.5em 0 1.5em 1.65em;
}
#search .search-result.child [class*='tag-'] {
    display: none;
}
#search .search-result.has-thumbnail {
    margin-bottom: 1.5em;
    padding-bottom: 1.5em;
    padding-left: 0;

    background-image: none !important;
}
#search .search-result.has-thumbnail .result-thumbnail {
    position: relative;

    overflow: auto;

    margin-bottom: 1em;
}
#search .search-result.has-thumbnail .result-thumbnail img {
    width: 100%;
    max-width: 250px;
}
#search .search-result.video ul.result-video-shortcuts {
    margin: .85em 0;
}
@media screen and (min-device-width: 768px) {
    #search .search-result.video ul.result-video-shortcuts {
        margin-left: 1em;
    }
}
#search .search-result.video li.result-video-shortcut.row .shortcut-timestamp,
#search .search-result.video li.result-video-shortcut.row .shortcut-sentence {
    font-size: 14px;
}
#search .search-result.video li.result-video-shortcut.row .shortcut-timestamp,
#search .search-result.video li.result-video-shortcut.row .shortcut-sentence:hover {
    color: #08c;
}
#search .search-result.video li.result-video-shortcut.row .shortcut-sentence {
    color: #999;
}
@media screen and (min-device-width: 320px) and (max-device-width: 767px) {
    #search .search-result.video li.result-video-shortcut.row {
        margin-bottom: .4em;
    }
    #search .search-result.video li.result-video-shortcut.row .col-10 {
        width: 12.5%;
    }
    #search .search-result.video li.result-video-shortcut.row .col-90 {
        width: 87.5%;
    }
    #search .search-result.video li.result-video-shortcut.row .shortcut-timestamp,
    #search .search-result.video li.result-video-shortcut.row .shortcut-sentence {
        font-size: 14px;
    }
}
@media screen and (min-device-width: 768px) {
    #search .search-result.video li.result-video-shortcut.row {
        margin-bottom: .15em;
    }
    #search .search-result.video li.result-video-shortcut.row .col-90 {
        padding-left: .35em;
    }
    #search .search-result.video li.result-video-shortcut.row .shortcut-sentence {
        min-height: 40px;
    }
    #search .search-result.video li.result-video-shortcut.row .shortcut-timestamp {
        display: block;
    }
}
#search .search-result.video .result-video-shortcut-more {
    font-size: 14px;

    margin-top: .65em;
    padding-top: .45em;

    -webkit-transition: all .35s ease-out .18s;
       -moz-transition: all .35s ease-out .18s;
         -o-transition: all .35s ease-out .18s;
            transition: all .35s ease-out .18s;

    opacity: 0;
}
@media screen and (min-device-width: 320px) and (max-device-width: 767px) {
    #search .search-result.video .result-video-shortcut-more {
        text-align: center !important;
    }
}
#search .search-result.video .result-video-shortcut-more.visible {
    opacity: 1;
}
#search .footer-breadory {
    border: none !important;
}
#search .shadow-box {
    position: fixed;
    z-index: 3;
    top: 0;
    left: 0;

    display: block;

    width: 100vw;
    height: 100vh;

    -webkit-transition: opacity .35s ease-in-out 0s;
       -moz-transition: opacity .35s ease-in-out 0s;
         -o-transition: opacity .35s ease-in-out 0s;
            transition: opacity .35s ease-in-out 0s;

    opacity: .84;
    background-color: white;

    backdrop-filter: blur(8px);
}
#search .shadow-box:not(.active) {
    pointer-events: none;

    opacity: 0;
}