/* ============================================================
   Page background
   ============================================================ */

/* Hide whole header and breadcrumb on search page, and disply back button  */
#wrapper:has(.search-page) header, #wrapper:has(.search-page) .sticky-nav--visible, #wrapper:has(.search-page) .breadcrumb, #wrapper:has(.search-page) > img, #wrapper:has(.search-page) #btn-header-search, body:has(.search-page) #btn-header-search  {
    display: none;
}
body:has(.search-page) .mobile-fixed-header {
    #back-btn-header-search {
        color: #fff;
        img {
            filter: invert(1);
        }
        &:hover {
            color: #fff;
            img {
                filter: invert(1);
            }
        }
    }
}
body:has(.search-page):not(.mob-menu-push-toright) .mobile-fixed-header #back-btn-header-search {
    display: block;
}

/* #wrapper:has(.search-page) is for DT; body:has(.search-page) is for MOB */
#wrapper:has(.search-page) {
    #back-btn-header-search {
        display: block;
        &:hover {
            color: #fff;
            img {
                filter: invert(1);
            }
        }
    }
}


.general-page-container:has(.search-page) {
    display: block;
    margin: 0;
    max-width: none;
    width: 100%;
}
.general-page-container:has(.search-page) > .columns {
    max-width: none;
}

.page:has(.search-page) {
    background-color: #E9E9E4;
    background-image: url(mural.png);
    background-position-y: bottom;
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 1000px;
}
.page:has(.search-page .gsc-results-wrapper-visible) {
    background-image:
        linear-gradient(to bottom, transparent 53%, #E9E9E4 58%),
        url(mural.png);
    background-position-y: 243px;
}

.page:has(.search-page) > div {
    font-family: 'vistasansot-med', Helvetica, Arial, Verdana, sans-serif;
}

.page:has(.search-page) h1 {
    display: none;
}

.search-title-wrapper {
    display: flex;
    justify-content: center;
}
.results-title {
    font-family: 'vistasansot-med', Helvetica, Arial, Verdana, sans-serif;
    font-size: 36px;
    line-height: 130%;
    margin-top: 285px;
    position: absolute;
    @media screen and (min-width: 40.063rem) {
        width: 952px;
    }
}

/* ============================================================
   Outer CSE wrapper
   ============================================================ */

.search-page .gsc-control-cse.gsc-control-cse-hr,
.glasnik-search .gsc-control-cse.gsc-control-cse-hr {
    background-color: transparent;
    border: none;
    padding: 0;
}

/* ============================================================
   Search form
   ============================================================ */

.search-page form.gsc-search-box {
    background-color: #000;
    margin: 0 0 90px;
    max-width: none;
    padding-bottom: 80px;
    padding-top: 80px;
}
.search-page form.gsc-search-box table {
    max-width: 952px;
    margin: 0 auto;
}

.search-page table,
.search-page .gsc-input-box,
.glasnik-search table,
.glasnik-search .gsc-input-box {
    background-color: transparent;
}

.search-page .gsc-input-box, .search-page .gsc-input-box table,
.glasnik-search .gsc-input-box, .glasnik-search .gsc-input-box table {
    border: none;
}
.search-page .gsc-input-box,
.glasnik-search .gsc-input-box {
    max-width: 754px;;
}

.search-page #gs_tti50 {
    background-position: right 16px center;
    background-image: url(search.svg);
    padding-left: 0;
}

.search-page input.gsc-input,
.gsc-input {
    font-family: 'vistasansot-regitalic', Helvetica, Arial, Verdana, sans-serif;
}

.search-page input.gsc-input {
    background: none !important;
    border-bottom: 1px solid #fff !important;
    color: #fff;
    font-size: 24px;
    padding: 16px 0 !important;
    width: 90% !important;
}
.search-page input.gsc-input:focus,
.glasnik-search input.gsc-input:focus {
    box-shadow: none;
}
.search-page input.gsc-input::placeholder {
    color: #FFFFFFBF;
    font-family: 'vistasansot-regitalic', Helvetica, Arial, Verdana, sans-serif;
    font-size: 24px;
}

.search-page .gsib_a::before,
.glasnik-search .gsib_a::before {
    content: none;
}

.glasnik-search .gsib_a {
    background-position: right 16px center !important; 
    padding: 4px 50px 4px 10px;
}

.search-page .gsib_a::after {
    color: #fff;
    content: "";
    cursor: pointer;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    width: 56px;
}

.search-page .gsib_b {
    display: none;
}

/* ============================================================
   Result count and sort
   ============================================================ */

.gsc-results-wrapper-nooverlay {
    margin: 0 8.4%;
    max-width: 952px;
    width: auto !important;
    @media screen and (min-width: 40.063rem) {
        margin: auto; 
    }
}

.search-page .gsc-above-wrapper-area,
.glasnik-search .gsc-above-wrapper-area {
    max-width: 100%;
}
.gsc-result-info-container {
    padding-left: 0;
}
.search-page .gsc-result-info,
.glasnik-search .gsc-result-info {
    color: #848484;
    font-family: 'Open Sans', sans-serif !important;
    font-size: 15px;
    line-height: 160%;
    padding-left: 0;
}
.search-page .gsc-above-wrapper-area-container .gsc-orderby-container,
.glasnik-search .gsc-above-wrapper-area-container .gsc-orderby-container {
    padding-right: 0;
}

.search-page .gsc-orderby-label,
.search-page .gsc-orderby-select,
.glasnik-search .gsc-orderby-label,
.glasnik-search .gsc-orderby-select {
    font-family: 'vistasansot-med', Helvetica, Arial, Verdana, sans-serif;
}

.gsc-control-cse .gsc-option-menu-container {
    border-radius: 15px;
    padding: 9px 0 9px 16px;
}
.gsc-control-cse .gsc-option-menu-container:has(.gsc-option-menu) {
    background-color: #fff;
}
.search-page .gsc-option-menu-container .gsc-option-menu,
.glasnik-search .gsc-option-menu-container .gsc-option-menu {
    font-family: 'vistasansot-reg', Helvetica, Arial, Verdana, sans-serif !important;
    border-radius: 15px;
    top: 40px !important;
}
.search-page .gsc-option-menu .gsc-option-menu-item:hover,
.glasnik-search .gsc-option-menu .gsc-option-menu-item:hover {
    background-color: transparent;
}
.search-page .gsc-option,
.glasnik-search .gsc-option {
    color: #3D405B;
}
.search-page .gsc-option-menu-item:has(.gsc-option-checkbox-checked) .gsc-option,
.glasnik-search .gsc-option-menu-item:has(.gsc-option-checkbox-checked) .gsc-option {
    font-weight: 700;
}

/* ============================================================
   Card grid
   ============================================================ */
.search-page .gsc-wrapper {
    max-width: 952px;
    padding-top: 19px;
}
.search-page .gsc-expansionArea,
.glasnik-search .gsc-expansionArea {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    padding: 0;
}

.search-page .gsc-webResult.gsc-result,
.glasnik-search .gsc-webResult.gsc-result {
    background: rgba(255, 255, 255, 0.7);
    border-radius: 15px;
    border: none;
    padding: 18px 20px;
    margin: 0;
    transition: background 0.5s ease;
    width: 100%;
}

.search-page .gsc-webResult.gsc-result:hover,
.glasnik-search .gsc-webResult.gsc-result:hover {
    background: #000;
}

/* Flatten Google's table layout */
.search-page .gsc-webResult.gsc-result > .gs-webResult > .gsc-table-cell-thumbnail,
.search-page .gsc-webResult.gsc-result > .gs-webResult > .gsc-thumbnail-inside,
.search-page .gsc-webResult.gsc-result > .gs-webResult > .gsc-url-top,
.glasnik-search .gsc-webResult.gsc-result > .gs-webResult > .gsc-table-cell-thumbnail,
.glasnik-search .gsc-webResult.gsc-result > .gs-webResult > .gsc-thumbnail-inside,
.glasnik-search .gsc-webResult.gsc-result > .gs-webResult > .gsc-url-top {
    display: none !important;
}

.search-page .gsc-table-result,
.glasnik-search .gsc-table-result {
    display: block !important;
    width: 100%;
}

.search-page .gsc-table-cell-snippet-close,
.glasnik-search .gsc-table-cell-snippet-close {
    display: block !important;
    width: 100%;
    padding: 0;
}

.search-page .gsc-table-cell-snippet-close .gsc-table-cell-thumbnail,
.search-page .gs-image-box,
.glasnik-search .gsc-table-cell-snippet-close .gsc-table-cell-thumbnail,
.glasnik-search .gs-image-box {
    display: none !important;
}

/* ============================================================
   Title
   ============================================================ */

.search-page .gs-title,
.glasnik-search .gs-title {
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.4;
    margin-bottom: 8px;
    display: block;
    text-decoration: none !important;
}

/* The title div also carries .gsc-table-cell-thumbnail which we hide above —
   override specifically so the title stays visible */
.search-page .gsc-table-cell-snippet-close .gs-title,
.glasnik-search .gsc-table-cell-snippet-close .gs-title {
    display: block !important;
}

.search-page .gs-title a,
.search-page a.gs-title,
.glasnik-search .gs-title a,
.glasnik-search a.gs-title {
    font-family: 'vistasansot-med', Helvetica, Arial, Verdana, sans-serif;
    color: #000 !important;
    font-size: 18px !important;
    font-weight: 400;
    line-height: 125%;
    text-decoration: none !important;
    transition: color 0.5s ease;
}

.search-page .gs-title b,
.search-page .gs-title a b,
.glasnik-search .gs-title b,
.glasnik-search .gs-title a b {
    color: #000 !important;
    font-weight: 600;
}

/* ============================================================
   Snippet
   ============================================================ */

.search-page .gs-snippet,
.glasnik-search .gs-snippet {
    font-family: 'Open Sans', sans-serif !important;
    font-size: 15px;
    color: #666;
    line-height: 1.5;
    margin-top: 6px;
}

.search-page .gs-snippet b,
.glasnik-search .gs-snippet b {
    color: #444;
    font-weight: 600;
}

/* ============================================================
   Card hover — invert all text to white
   ============================================================ */

.search-page .gsc-result:hover .gs-title a,
.search-page .gsc-result:hover a.gs-title,
.search-page .gsc-result:hover .gs-title a b,
.search-page .gsc-result:hover a.gs-title b,
.search-page .gsc-result:hover .gs-snippet,
.search-page .gsc-result:hover .gs-snippet b,
.glasnik-search .gsc-result:hover .gs-title a,
.glasnik-search .gsc-result:hover a.gs-title,
.glasnik-search .gsc-result:hover .gs-title a b,
.glasnik-search .gsc-result:hover a.gs-title b,
.glasnik-search .gsc-result:hover .gs-snippet,
.glasnik-search .gsc-result:hover .gs-snippet b {
    color: #fff !important;
    transition: color 0.5s ease;
}

/* ============================================================
   Hide URLs and dividers
   ============================================================ */

.search-page .gsc-url-top,
.search-page .gsc-url-bottom,
.search-page .gs-visibleUrl,
.search-page .gs-visibleUrl-long,
.search-page .gs-visibleUrl-short,
.search-page .gs-visibleUrl-breadcrumb,
.search-page .gsc-webResult-divider,
.glasnik-search .gsc-url-top,
.glasnik-search .gsc-url-bottom,
.glasnik-search .gs-visibleUrl,
.glasnik-search .gs-visibleUrl-long,
.glasnik-search .gs-visibleUrl-short,
.glasnik-search .gs-visibleUrl-breadcrumb,
.glasnik-search .gsc-webResult-divider {
    display: none !important;
}

/* ============================================================
   Pagination
   ============================================================ */

.search-page .gsc-cursor-box,
.glasnik-search .gsc-cursor-box {
    display: flex !important;
    justify-content: center;
    gap: 8px;
    padding: 24px 0;
    border-top: none;
    background: transparent;
}

.search-page .gsc-cursor-box .gsc-cursor,
.glasnik-search .gsc-cursor-box .gsc-cursor {
    display: flex !important;
    gap: 8px;
}

.search-page .gsc-cursor-box .gsc-cursor-page,
.glasnik-search .gsc-cursor-box .gsc-cursor-page {
    font-family: 'Open Sans', sans-serif !important;
    background: #fff;
    border: 1px solid #e2e5ea;
    border-radius: 6px;
    color: #333;
    cursor: pointer;
    height: 36px;
    min-width: 36px;
    padding: 0 10px;
    font-size: 12px;
    display: flex !important;
    justify-content: center;
    align-items: center;
    text-decoration: none !important;
    transition: all 0.2s ease;
}

.search-page .gsc-cursor-box .gsc-cursor-page:hover,
.glasnik-search .gsc-cursor-box .gsc-cursor-page:hover {
    border-color: #000;
    color: #000;
}

.search-page .gsc-cursor-box .gsc-cursor-current-page,
.glasnik-search .gsc-cursor-box .gsc-cursor-current-page {
    background: #000 !important;
    border-color: #000;
    color: #fff !important;
    font-weight: 600;
}

/* ============================================================
   Footer / branding
   ============================================================ */

.search-page .gcsc-find-more-on-google,
.glasnik-search .gcsc-find-more-on-google {
    color: #848484;
}

.search-page .gcsc-find-more-on-google svg,
.glasnik-search .gcsc-find-more-on-google svg {
    display: none;
}

.search-page .gsc-branding,
.search-page .gcsc-branding,
.search-page .gcsc-more-maybe-branding-root,
.glasnik-search .gsc-branding,
.glasnik-search .gcsc-branding,
.glasnik-search .gcsc-more-maybe-branding-root {
    font-family: 'Open Sans', sans-serif !important;
}

/* ============================================================
   Responsive
   ============================================================ */

@media (max-width: 1024px) {
    .search-page form.gsc-search-box {
        margin-top: 22px;
    }
    .search-page .gsc-expansionArea,
    .glasnik-search .gsc-expansionArea {
        grid-template-columns: 1fr !important;
    }
    .results-title {
        font-size: 28px;
        line-height: 100%;
    }
    .search-page .gsc-wrapper,
    .glasnik-search .gsc-wrapper {
        padding-top: 24px;
    }
}
@media (max-width: 640px) {
    .search-page form.gsc-search-box {
        margin-top: 0;
    }
    .glasnik-search .gsc-search-box .gsc-input {
        padding-left: 0 !important;
    }
}

/* ============================================================
   Službeni glasnik search widget
   Figma: 4036-36475 (empty) / 4036-40517 (typed) / 4036-42155 (results)

   Unlike the search page this is embedded in a normal content page:
   no black band, no chrome hiding, dark text on the light page.
   The input is lifted into the H1 header row the same way
   .natrag-na-sve is (stil.css:2663) — .general-page-container.row
   is position:relative (stil.css:2448).
   ============================================================ */

/* --- Searchbox lifted into the page header row, opposite the H1.
       Figma: 92px tall box, top-aligned in the 120px header row, so it
       ends 28px above where the content flow starts. --- */
/* Width interpolates 280px -> 525px as the viewport grows 1025px -> ~1381px,
   so the box stops crowding the H1 as the container narrows
   (.general-page-container is 83.2% wide, capped at 1186px, while the H1 starts
   231px in — stil.css:2656). 525px is held from ~1381px up; below 1025px the
   media query at the end of this block puts the box back into the flow. */
.general-page-container:has(.official-newspaper-wrapper) #GoogleSearchForm {
    position: absolute;
    right: 0;
    top: 15px;
    width: clamp(280px, 68.2vw - 417px, 525px);
}

.glasnik-search form.gsc-search-box {
    background-color: transparent;
    margin: 0;
    max-width: none;
    padding: 0;
}
.glasnik-search form.gsc-search-box table {
    margin: 0;
    max-width: none;
}

/* 44px row. CSE lays the box out as a table, so every wrapper between the form
   and the input has to stop adding vertical padding/height of its own. */
.glasnik-search form.gsc-search-box table,
.glasnik-search form.gsc-search-box tbody,
.glasnik-search form.gsc-search-box tr,
.glasnik-search form.gsc-search-box td {
    height: 44px;
    padding-block: 0 !important;
    vertical-align: middle;
}
.glasnik-search form.gsc-search-box td {
    height: 24px;
}
.glasnik-search .gsib_a {
    padding-block: 0;
}

.glasnik-search .gsc-input-box {
    border-bottom: 1px solid transparent;
    height: 44px;
    max-width: none;
    transition: border-color 0.3s ease;
}
/* The rule only appears once something is typed (Figma: empty state has none).
   Depends on the placeholder patched in by WUC_SluzbeniGlasnik.ascx. */
.glasnik-search .gsc-input-box:has(input.gsc-input:not(:placeholder-shown)),
.glasnik-search .gsc-input-box:focus-within {
    border-bottom-color: #fff;
}

.glasnik-search input.gsc-input {
    background: none !important;
    border: none !important;
    color: #3E3D3D;
    font-family: 'vistasansot-reg', Helvetica, Arial, Verdana, sans-serif;
    font-size: 16px;
    height: 44px !important;
    line-height: 44px;
    padding: 0 !important;
    width: 100% !important;
    box-shadow: none !important;
}
.glasnik-search input.gsc-input::placeholder {
    color: #848484;
    font-family: 'vistasansot-regitalic', Helvetica, Arial, Verdana, sans-serif;
    font-size: 16px;
}
.gsc-orderby-label {
    color: #3D405B !important;
}
/* Figma puts the idle placeholder at the right of the row, next to the
   magnifier, while typed text stays left-aligned. text-align is the one
   property that moves the placeholder without also shifting the value: any
   padding or indent here would apply to the typed text too.
   :not(:focus) drops it back to the left the moment the field is clicked, so
   the caret never sits at the right edge waiting for the first character. */
.glasnik-search input.gsc-input:placeholder-shown:not(:focus) {
    text-align: right;
}

/* Google's submit button becomes the 24px magnifier from the design.
   !important because foundation.css styles .gsc-search-button input and
   loads after this file. Both markup shapes are covered: CSE renders an
   <input class="gsc-search-button"> or a <button class="gsc-search-button-v2">. */
.glasnik-search .gsc-search-button,
.glasnik-search input.gsc-search-button,
.glasnik-search button.gsc-search-button-v2 {
    background: url(search.svg) no-repeat center / 24px 24px !important;
    border: none !important;
    box-shadow: none !important;
    font-size: 0 !important;
    height: 24px !important;
    margin: 0 0 0 16px !important;
    min-width: 0 !important;
    padding: 0 !important;
    width: 24px !important;
}
.glasnik-search button.gsc-search-button-v2 svg {
    display: none;
}

/* --- Clear ("×") button ---------------------------------------------------
   CSE keeps the clear cell (td.gsib_b > .gsst_b > a.gsst_a > span.gscb_a) in
   the DOM at all times and toggles it itself, unreliably; here it is driven
   off the data-searched flag instead (set by the MutationObserver in
   WUC_SluzbeniGlasnik.ascx once results are actually rendered), so typing alone
   doesn't swap the icons — only a submitted search does.
   The cell lives inside the input-box table, i.e. left of the magnifier, so it
   is taken out of that flow and parked over the magnifier instead: both icons
   share one 24px slot at the right edge of the row. The magnifier goes
   visibility:hidden rather than display:none so its cell keeps the slot
   reserved and the input doesn't reflow on the swap. */
.glasnik-search form.gsc-search-box {
    position: relative;
}
/* Anchors the slot: without this the td's own padding would offset the
   magnifier from the right edge the "×" is pinned to. */
.glasnik-search form.gsc-search-box td.gsc-search-button {
    padding-right: 0 !important;
}
.glasnik-search .gsib_b {
    display: none;
    height: 24px;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
}
#GooglepretrazivanjeGlasnika[data-searched="true"] .gsib_b {
    display: block;
    padding-right: 24px;
}
#GooglepretrazivanjeGlasnika[data-searched="true"] .gsc-search-button {
    visibility: hidden;
}
/* .gsib_a is the cell holding the input and CSE paints a second magnifier on it
   as a background image (positioned by the rule near the top of this file), so
   only that background is dropped — display:none here would take the input with it. */
#GooglepretrazivanjeGlasnika[data-searched="true"] .gsib_a {
    background-image: none !important;
}
.glasnik-search .gsib_b .gsst_a {
    background: url(Close-x-icon.svg) no-repeat center / 24px 24px;
    display: block;
    height: 24px;
    padding: 0;
    text-decoration: none;
    width: 24px;
}
/* Google's own "×" glyph, replaced by the SVG above. */
.glasnik-search .gsib_b .gscb_a {
    display: none;
}

/* --- Results --- */
/* The unscoped .gsc-results-wrapper-nooverlay rule above indents the search
   page inside a full-bleed container; here the page container already does that. */
.glasnik-search .gsc-results-wrapper-nooverlay {
    margin: 0;
    max-width: none;
}
.glasnik-search .gsc-wrapper {
    max-width: none;
    padding-top: 0;
}

/* "Rezultati pretraživanja" + the #D9D9D9 rule above it (Figma: 47px gap) */
.glasnik-results-title {
    border-top: 1px solid #D9D9D9;
    font-family: 'vistasansot-med', Helvetica, Arial, Verdana, sans-serif;
    font-size: 36px;
    line-height: 130%;
    margin: 40px 0 12px;
    padding-top: 40px;
    @media (max-width: 1024px) {
        margin-top: 10px;
    }
}

/* The right half of that rule goes 2px #000 to echo the input's underline while
   the left half stays 1px #D9D9D9 — whenever the input is focused OR still holds
   a term, so it stays black after the user searches and clicks away. Same two
   conditions as the input's own underline above, kept in step deliberately.
   A border can't vary per segment, so the rule is repainted as two background
   layers over the border strip — one per half, each with its own height.
   background-origin: border-box puts them where the border was. */
.glasnik-search:has(input.gsc-input:focus) .glasnik-results-title,
.glasnik-search:has(input.gsc-input:not(:placeholder-shown)) .glasnik-results-title {
    border-top: 2px solid #000;
    @media (min-width: 64rem) {
        background-image:
            linear-gradient(#D9D9D9, #D9D9D9),
            linear-gradient(#000, #000);
        background-origin: border-box;
        background-position: top left, top right;
        background-repeat: no-repeat;
        background-size: 45% 1px, 55% 2px;
        border-top-color: transparent;
    }
}

/* Before the first search the results title is hidden and the rule under the
   header row is .related-docs' own border-top, so it takes over the same
   split-colour treatment on focus. Scoped to the glasnik page — .related-docs
   is shared with other templates. Base border is #E9E9E4 here, so the left
   half keeps that colour rather than the title's #D9D9D9. */
#GooglepretrazivanjeGlasnika:has(input.gsc-input:focus) ~ .official-newspaper-wrapper .related-docs,
#GooglepretrazivanjeGlasnika:has(input.gsc-input:not(:placeholder-shown)) ~ .official-newspaper-wrapper .related-docs {
    border-top: 2px solid #000;
    @media (min-width: 64rem) {
        background-image:
            linear-gradient(#E9E9E4, #E9E9E4),
            linear-gradient(#000, #000);
        background-origin: border-box;
        background-position: top left, top right;
        background-repeat: no-repeat;
        background-size: 45% 1px, 55% 2px;
        border-top-color: transparent;
    }
}

/* Cards: 2 x 468 + 24 gap = 960. Reads borderless because the page is white. */
.glasnik-search .gsc-expansionArea {
    gap: 24px;
}
.glasnik-search .gsc-webResult.gsc-result {
    padding: 24px;
    background: #E3E3E380;
}
.glasnik-search .gs-snippet {
    color: #000;
    line-height: 24px;
}

/* Pagination: 32px squares, 4px radius (Figma) */
.glasnik-search .gsc-cursor-box .gsc-cursor-page {
    border-color: #DFE3E8;
    border-radius: 4px;
    color: #212B36;
    font-weight: 700;
    height: 32px;
    min-width: 32px;
    padding: 0 6px;
}

/* Idle state = year tabs + document list.
   Active search = result cards replace them. Flag is set by the
   MutationObserver in WUC_SluzbeniGlasnik.ascx. */
#GooglepretrazivanjeGlasnika[data-searched="true"] ~ .official-newspaper-wrapper {
    display: none;
}

@media (max-width: 1024px) {
    /* Header row has no room for it at this width — put it back in flow. */
    .general-page-container:has(.official-newspaper-wrapper) #GoogleSearchForm {
        position: static;
        margin-bottom: 24px;
        width: 100%;
    }
    .general-page-container:has(.official-newspaper-wrapper) .glasnik-search #GoogleSearchForm {
        margin-bottom: 0;
    }
    .glasnik-search .gsc-control-cse {
        padding: 0 !important;
    }
    .glasnik-results-title {
        font-size: 28px;
        line-height: 100%;
        padding-top: 24px;
    }
}