/* 
   =============================================================================
   File that preserves useful defaults, normalizes 
   styles for a wide range of elements, corrects bugs and common browser 
   inconsistencies, and improves usability with subtle modifications. 
   Ensures compatibility and relevance for browsers in 2024.

   Detailed comments are included to explain each section for better 
   maintainability and understanding.
   =============================================================================
*/
/* 
1. Document Settings
   ---------------------------------------------------------------------------
   Establishes the base settings for the document to ensure consistency across
   all browsers.
*/
*
{
    box-sizing: border-box;
}

html
{
    /* Sets the base line-height for typography */
    line-height: 1.15;
    /* Removes default margin to ensure consistency */

    margin: 0; 
    /* Prevents font scaling in landscape orientation on mobile devices */

    -webkit-text-size-adjust: 100%;
    /* Enhances compatibility with modern color schemes, including dark mode */
    color-scheme: light dark;
}

body
{
    /* Applies a system font stack for optimal performance and readability */
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,  'Helvetica Neue', Arial, sans-serif;
    /* Sets a default font size for accessibility */
    font-size: 16px;
    /* Establishes a comfortable line height for text */
    line-height: 1.5;
    /* Removes default margin to eliminate unexpected spacing */

    margin: 0;

    color: var(--text-color, #000); 
    /* Defines default background and text colors with CSS variables for flexibility */
    background-color: var(--background-color, #fff);
}

/* 
2. Typography
   ---------------------------------------------------------------------------
   Normalizes heading elements to ensure consistent sizing and spacing.
*/
h1,
h2,
h3,
h4,
h5,
h6
{
    /* Sets a consistent font-weight for all headings */
    font-weight: 600; 
    /* Removes default margin and sets a consistent bottom margin */

    margin: 0 0 .5em 0;
}

p
{
    /* Removes default margin and sets a consistent bottom margin */
    margin: 0 0 1em 0;
}

/* 
3. Links
   ---------------------------------------------------------------------------
   Normalizes link styles to enhance usability and accessibility.
*/
a
{
    /* Removes default underline to allow custom styling */
    text-decoration: none;

    color: inherit;
    /* Removes default background color and inherits text color */
    background-color: transparent;
    /* Enhances accessibility by providing a focus outline */
}
a:focus
{
    outline: none;
}

/* 
4. Buttons and Form Elements
   ---------------------------------------------------------------------------
   Ensures consistent styling and behavior across buttons and form controls.
*/
button,
input,
textarea,
select
{
    /* Inherits font properties to match surrounding text */
    font: inherit;
    /* Removes default margin, padding, and border for custom styling */

    margin: 0;
    padding: 0;
    /* Sets cursor to pointer for better UX */

    cursor: pointer;

    border: none;
    background: none;
    /* Adds a focus outline for accessibility */
}
button:focus,
input:focus,
textarea:focus,
select:focus
{
    outline: 2px solid var(--focus-color, #00f);
    outline-offset: 2px;
}

/* 
5. Lists
   ---------------------------------------------------------------------------
   Removes default list styling to allow for custom list designs.
*/
ul,
ol
{
    /* Removes default padding and margin */
    margin: 0;
    padding: 0; 
    /* Removes default list styles */

    list-style: none;
}

/* 
6. Images and Media
   ---------------------------------------------------------------------------
   Ensures that images and media elements scale correctly and don't overflow.
*/
img,
picture,
video,
canvas,
svg
{
    /* Makes media elements responsive */
    max-width: 100%;
    height: auto;
    /* Removes default border styles */

    border: 0;
}

/* 
7. Tables
   ---------------------------------------------------------------------------
   Normalizes table styles for consistent rendering across browsers.
*/
table
{
    /* Ensures tables take full width by default */
    width: 100%; 
    /* Removes default spacing */

    border-spacing: 0;
    /* Collapses borders for a cleaner look */
    border-collapse: collapse;
}

th,
td
{
    /* Adds padding for better readability */
    padding: .5em;
    /* Aligns text to the left by default */

    text-align: left;
    /* Adds a border for table cells */

    border: 1px solid #ddd;
}

/* 
8. Forms
   ---------------------------------------------------------------------------
   Enhances the usability and accessibility of form elements.
*/
label
{
    /* Ensures labels are properly associated with inputs */
    display: inline-block;

    margin-bottom: .5em;
}

input[type='checkbox'],
input[type='radio']
{
    /* Adjusts the size of checkbox and radio inputs */
    width: 1em;
    height: 1em;
}

/* 
9. Code and Preformatted Text
   ---------------------------------------------------------------------------
   Normalizes styles for code and preformatted text elements.
*/
code,
kbd,
samp,
pre
{
    /* Sets a monospace font for code elements */
    font-family: 'Courier New', Courier, monospace;
    /* Sets a consistent font size */
    font-size: 1em;
}

pre
{
    overflow: auto; 
    /* Adds padding and a light background for better readability */

    padding: 1em;

    background-color: #f5f5f5;
}

/* 
10. Miscellaneous
    ---------------------------------------------------------------------------
    Normalizes miscellaneous elements to ensure consistent behavior.
*/
figure
{
    /* Removes default margin for better control over spacing */
    margin: 0;
}

fieldset
{
    /* Removes default margin, padding, and border for custom styling */
    margin: 0;
    padding: 0;

    border: none;
}

legend
{
    font-weight: bold; 
    /* Ensures legends are accessible and properly styled */

    padding: 0;
}

/* 
11. Accessibility Enhancements
    ---------------------------------------------------------------------------
    Adds enhancements to improve accessibility across various elements.
*/
:focus
{
    /* Ensures all focused elements have a visible outline */
    outline: 2px solid var(--focus-color, #00f);
    outline-offset: 2px;
}

::-moz-selection
{
    color: var(--selection-color, #000); 
    /* Customizes the color of selected text */
    background: var(--selection-background, #b3d4fc);
}

::selection
{
    color: var(--selection-color, #000); 
    /* Customizes the color of selected text */
    background: var(--selection-background, #b3d4fc);
}

/* 
12. Responsive Enhancements
    ---------------------------------------------------------------------------
    Adds responsiveness to ensure elements adapt well to different screen sizes.
*/
@media (prefers-reduced-motion: reduce)
{
    *
    {
        transition: none !important; 
        /* Disables animations and transitions for users who prefer reduced motion */
        animation: none !important;
    }
}

/* 
13. Utility Classes
    ---------------------------------------------------------------------------
    Provides utility classes for common styling needs.
*/
.hidden
{
    /* Utility class to hide elements visually but keep them accessible to screen readers */
    position: absolute;

    overflow: hidden;
    clip: rect(0, 0, 0, 0);

    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;

    white-space: nowrap;

    border: 0;
}

.visually-hidden
{
    /* Alternative utility class for visually hiding elements */
    position: absolute;

    overflow: hidden;
    clip: rect(0 0 0 0);

    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;

    white-space: nowrap;

    border: 0;
}

/* Add display block for the <main> element to ensure consistent rendering */
main
{
    display: block;
}

.wp-env-marker
{
    margin-left: 4px !important;
}

.wp-env-development,
.wp-env-local
{
    color: greenyellow;
}

.wp-env-staging
{
    color: gold;
}

.wp-env-production
{
    color: salmon;
}

.wp-env-undefined
{
    color: dimgray;
}

#backlink
{
    display: flex;
    flex-direction: row;

    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
}
@media screen and (max-width: 1000px)
{
    #backlink
    {
        flex-wrap: wrap;
        gap: 0;
    }
}

.shifter
{
    display: flex;
    flex-direction: row;

    width: 100%;
    max-width: 1073px; 

    flex-wrap: nowrap;
    justify-content: flex-end;
    align-items: center;
}
@media screen and (max-width: 1000px)
{
    .shifter
    {
        display: flex;
        flex-direction: row;

        flex-wrap: wrap;
        justify-content: center;
        align-items: flex-start;
    }
}
.shifter.content
{
    max-width: 881px;
}
@media screen and (min-width: 1001px)
{
    .shifter.content
    {
        margin-right: 0;
    }
}
@media screen and (min-width: 1000px) and (max-width: 1233px)
{
    .shifter
    {
        display: flex;
        flex-direction: row;

        margin-left: 85px; 

        flex-wrap: nowrap;
        justify-content: flex-start;
        align-items: flex-start;
    }
}

gooogle-app
{
    display: flex;
    flex-direction: column;

    width: 100%; 

    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: stretch;
}
@media screen and (max-width: 1000px)
{
    gooogle-app
    {
        display: flex;
        flex-direction: column;

        flex-wrap: wrap;
        justify-content: flex-start;
        align-items: flex-start;
    }
}
gooogle-app app-header
{
    display: flex;
    flex-direction: row;

    width: 100%;
    padding-top: 26px; 

    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: stretch;
}
@media screen and (max-width: 1000px)
{
    gooogle-app app-header
    {
        padding: 0 18px;
    }
}
gooogle-app app-header .header-mobile
{
    display: none;

    width: 100%;
    padding: 15px 0 14px;
}
@media screen and (max-width: 1000px)
{
    gooogle-app app-header .header-mobile
    {
        display: flex;
        flex-direction: row;

        flex-wrap: nowrap;
        justify-content: space-between;
        align-items: center;
    }
}
gooogle-app app-header-left
{
    display: flex;
    flex-direction: row;

    width: 100%;
    max-width: 1073px; 

    flex-wrap: nowrap;
    justify-content: flex-end;
    align-items: center;
}
gooogle-app app-header-left .logo
{
    min-width: 161px;
    margin-top: 5px; 
    padding: 4px 44px 0 24px;
}
@media screen and (max-width: 1000px)
{
    gooogle-app app-header-left .logo
    {
        display: none;
    }
}
@media screen and (min-width: 1000px) and (max-width: 1233px)
{
    gooogle-app app-header-left
    {
        margin-left: 85px;
    }
    gooogle-app app-header-left .logo
    {
        min-width: auto;
        padding-left: 0;
    }
}
gooogle-app app-header .profile
{
    line-height: 1;

    display: block;

    min-height: 35px; 
    margin-top: 3px;
    margin-left: 75px;
}
gooogle-app app-header .profile img
{
    width: 73px;
    min-width: 73px; 
    height: 33px;
    min-height: 33px;
}
@media screen and (max-width: 1000px)
{
    gooogle-app app-header .profile
    {
        display: none;
    }
}
gooogle-app app-header-main
{
    display: flex;
    flex-direction: row;

    width: 100%; 

    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
}
@media screen and (min-width: 1001px)
{
    gooogle-app app-header-main
    {
        margin-right: 21px;
    }
}
gooogle-app app-header-search
{
    display: flex;
    flex-direction: row;

    width: 100%;
    max-width: 862px; 

    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: stretch;
}
gooogle-app app-header-search .search
{
    display: flex;
    flex-direction: row;

    width: 100%;
    height: 46px;

    border: 1px solid transparent;
    border-radius: 24px;
    background-color: white;
    box-shadow: 0 2px 8px 0 rgba(60, 64, 67, .25); 

    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
}
@media screen and (max-width: 1000px)
{
    gooogle-app app-header-search .search
    {
        background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTYuNjM4OSAxMi42MzU3QzcuOTQ4NzQgMTIuNjM1NyA5LjE3MTc4IDEyLjIwOTYgMTAuMTY2IDExLjQ5OTVMMTMuOTA2MSAxNS4yMzk2QzE0LjA3OTcgMTUuNDEzMiAxNC4zMDg2IDE1LjUgMTQuNTQ1MyAxNS41QzE1LjA1ODIgMTUuNSAxNS40MjkgMTUuMTA1NSAxNS40MjkgMTQuNjAwNUMxNS40MjkgMTQuMzYzOCAxNS4zNTAxIDE0LjE0MjggMTUuMTc2NSAxMy45NjkyTDExLjQ2MDEgMTAuMjQ0OUMxMi4yNDEyIDkuMjE5MSAxMi43MDY4IDcuOTQ4NzEgMTIuNzA2OCA2LjU2Nzg2QzEyLjcwNjggMy4yMzAxNCA5Ljk3NjYyIDAuNSA2LjYzODkgMC41QzMuMjkzMyAwLjUgMC41NzEwNDUgMy4yMzAxNCAwLjU3MTA0NSA2LjU2Nzg2QzAuNTcxMDQ1IDkuOTA1NTggMy4yOTMzIDEyLjYzNTcgNi42Mzg5IDEyLjYzNTdaTTYuNjM4OSAxMS4zMjU5QzQuMDI3MTIgMTEuMzI1OSAxLjg4MDg4IDkuMTcxNzUgMS44ODA4OCA2LjU2Nzg2QzEuODgwODggMy45NjM5NyA0LjAyNzEyIDEuODA5ODQgNi42Mzg5IDEuODA5ODRDOS4yNDI4IDEuODA5ODQgMTEuMzk2OSAzLjk2Mzk3IDExLjM5NjkgNi41Njc4NkMxMS4zOTY5IDkuMTcxNzUgOS4yNDI4IDExLjMyNTkgNi42Mzg5IDExLjMyNTlaIiBmaWxsPSIjOEU4RTkzIi8+Cjwvc3ZnPgo=);
        background-repeat: no-repeat;
        background-position: 12px;
    }
}
gooogle-app app-header-search .search__text
{
    font: 16px arial, sans-serif; 
    line-height: 22px;

    overflow: hidden;

    padding: 0 19px;

    white-space: nowrap;
    text-overflow: ellipsis;

    color: rgba(0, 0, 0, .87);
}
@media screen and (max-width: 1000px)
{
    gooogle-app app-header-search .search__text
    {
        padding-left: 56px;
    }
}
gooogle-app app-header-search .search__panel
{
    display: flex;
    flex-direction: row;

    padding: 0 22px; 

    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    gap: 19px;
}
@media screen and (max-width: 1000px)
{
    gooogle-app app-header-search .search__panel img:nth-child(2)
    {
        display: none;
    }
}
gooogle-app app-header .tabs
{
    display: flex;
    flex-direction: row;

    width: 100%;
    margin-top: 29px;

    border-bottom: 1px solid #dadce0; 

    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: flex-start;
}
@media screen and (max-width: 1000px)
{
    gooogle-app app-header .tabs
    {
        width: calc(100% + 32px);
        margin: 10px -18px 0;
        padding: 0 5px 5px;

        box-shadow: 0 2px 3px -1px rgba(60, 64, 67, .08);
    }
}
gooogle-app app-header .tabs__wrapper
{
    display: flex;
    flex-direction: row;

    width: 100%;
    max-width: 862px;
    padding-left: 9px; 

    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: flex-start;
}
@media screen and (max-width: 1000px)
{
    gooogle-app app-header .tabs__wrapper
    {
        padding-left: 0;
    }
}
gooogle-app app-header .tabs ul
{
    position: relative; 

    display: flex;
    flex-direction: row;

    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 2px;
}
@media screen and (max-width: 1000px)
{
    gooogle-app app-header .tabs ul
    {
        overflow: hidden;

        flex-wrap: nowrap;
        gap: 0;
    }
    gooogle-app app-header .tabs ul:nth-child(2)
    {
        display: none;
    }
    gooogle-app app-header .tabs ul::before
    {
        position: absolute;
        top: 0;
        right: 0;

        display: block;

        width: 34px;
        height: 100%;

        content: '';

        background: linear-gradient(270deg, white 49.091%, rgba(255, 255, 255, 0) 100%);
    }
}
gooogle-app app-header .tabs ul li
{
    display: flex;
    flex-direction: row;

    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
}
gooogle-app app-header .tabs ul li a
{
    font-size: 14px; 

    display: flex;
    flex-direction: row;

    width: -moz-fit-content;
    width:      fit-content;

    color: #828282;

    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
}
gooogle-app app-header .tabs ul li a.active
{
    padding-bottom: 6.5px;

    color: #202124;
    border-bottom: 3px solid #202124;
}
@media screen and (max-width: 1000px)
{
    gooogle-app app-header .tabs ul li a.active
    {
        padding-bottom: 3.5px;

        border-bottom: 2px solid #202124;
    }
}
gooogle-app app-header .tabs ul li a.more::before
{
    font-size: 16px; 

    content: '\2807';
}
@media screen and (min-width: 1001px)
{
    gooogle-app app-header .tabs ul li a
    {
        font-weight: 400; 
        line-height: 22px;

        padding: 0 10px;
    }
}
@media screen and (max-width: 1000px)
{
    gooogle-app app-header .tabs ul li a
    {
        display: flex;

        margin: 4px 12px 1px;

        white-space: nowrap; 

        align-items: flex-start;
    }
    gooogle-app app-header .tabs ul li a img
    {
        display: none;
    }
}
gooogle-app app-content
{
    width: 100%;
    max-width: 652px;
}
@media screen and (max-width: 1000px)
{
    gooogle-app app-content
    {
        background: #e8eaed;
    }
}
gooogle-app app-content-results
{
    font-size: 14px;

    display: block; 

    padding: 22px 0;

    color: #828282;
}
@media screen and (max-width: 1000px)
{
    gooogle-app app-content-results
    {
        padding: 10px 18px;

        background: white;
    }
}
gooogle-app app-content .search-more
{
    font-size: 14px;
    line-height: 22px;

    display: block; 

    color: #1718a4;
}
@media screen and (min-width: 1001px)
{
    gooogle-app app-content .search-more:hover
    {
        text-decoration: underline;
    }
}
gooogle-app app-content .search-more:after
{
    display: none;
}
@media screen and (max-width: 1000px)
{
    gooogle-app app-content .search-more
    {
        display: none !important;
    }
}
gooogle-app app-content .search-list
{
    position: relative; 

    display: flex;
    flex-direction: column;

    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: stretch;
}
gooogle-app app-content .top-search-result .search-item
{
    box-shadow: none;
}
@media screen and (max-width: 1000px)
{
    gooogle-app app-content .top-search-result .search-item
    {
        margin-bottom: 0;
    }
}
gooogle-app app-content .top-search-result .search-item.sub-search-item
{
    position: relative;

    max-width: calc(100% - 10px); 
    margin-top: 4px;
    margin-bottom: 0;
    margin-left: 8px;
    padding: 15px 0;

    border-top: 1px solid #dadce0;

    gap: 0;
}
gooogle-app app-content .top-search-result .search-item.sub-search-item:after
{
    position: absolute;
    top: 50%;
    right: 0; 

    width: 23px;
    height: 23px;

    content: '';
    transform: translateY(-50%);

    background-image: url('data:image/svg+xml,<svg fill-rule="evenodd" clip-rule="evenodd" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill-rule="nonzero" fill="%235e5e5e" d="M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z"></path></svg>');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}
gooogle-app app-content .top-search-result .search-item.sub-search-item:nth-child(2)
{
    margin-top: 12px;
}
gooogle-app app-content .top-search-result .search-item.sub-search-item .search-item__title,
gooogle-app app-content .top-search-result .search-item.sub-search-item p
{
    margin-left: 2px;
}
gooogle-app app-content .top-search-result .search-item.sub-search-item .search-item__title
{
    font-size: 18px;
    font-weight: 400; 

    color: #202124;
}
gooogle-app app-content .top-search-result .search-item.sub-search-item p
{
    overflow: hidden;
    overflow: ellipsis; 

    color: #828282;
}
@media screen and (max-width: 1000px)
{
    gooogle-app app-content .top-search-result .search-item.sub-search-item
    {
        margin-right: 18px;
        margin-left: 18px;
        padding-right: 16px;
        padding-left: 16px;

        border: none; 
        background-color: #e8eaed;
    }
    gooogle-app app-content .top-search-result .search-item.sub-search-item::after
    {
        right: 11px;
    }
    gooogle-app app-content .top-search-result .search-item.sub-search-item p
    {
        display: none;
    }
    gooogle-app app-content .top-search-result .search-item.sub-search-item:nth-child(2)
    {
        border-top-left-radius: 16px;
        border-top-right-radius: 16px;
    }
    gooogle-app app-content .top-search-result .search-item.sub-search-item:nth-last-child(2)
    {
        border-bottom-right-radius: 16px; 
        border-bottom-left-radius: 16px;
    }
}
gooogle-app app-content .top-search-result > .search-item
{
    margin-bottom: 6px;
}
@media screen and (min-width: 1001px)
{
    gooogle-app app-content .top-search-result
    {
        margin-bottom: 30px;
    }
}
@media screen and (max-width: 1000px)
{
    gooogle-app app-content .top-search-result
    {
        margin-bottom: 8px;
        padding-bottom: 10px;

        background: white;
    }
}
gooogle-app app-content .search-item
{
    display: flex;
    flex-direction: column;

    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: stretch;
    gap: 8px;
}
gooogle-app app-content .search-item__sponsored
{
    font-family: Arial;
    font-size: 15px;
    font-weight: 700;
    line-height: 22px;

    text-align: left;
    letter-spacing: -.40799999237060547px;

    color: #202124; 

    text-underline-position: from-font;
    -webkit-text-decoration-skip-ink: none;
            text-decoration-skip-ink: none;
}
gooogle-app app-content .search-item__head
{
    display: flex;
    flex-direction: row;

    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
}
gooogle-app app-content .search-item__icon
{
    display: flex;
    display: inline-flex;
    overflow: hidden;
    flex-direction: row;

    margin-right: 12px;

    vertical-align: middle;

    border: 1px solid #dadce0; 
    border-radius: 50%;
    background-color: #e8eaed;

    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
}
gooogle-app app-content .search-item__icon img
{
    position: relative;
    z-index: 1;

    display: block;

    width: 100%;
    height: 100%; 

    -o-object-fit: cover;
       object-fit: cover;
}
@media screen and (min-width: 1001px)
{
    gooogle-app app-content .search-item__icon
    {
        width: 28px;
        height: 28px;
    }
}
@media screen and (max-width: 1000px)
{
    gooogle-app app-content .search-item__icon
    {
        width: 26px; 
        height: 26px;
    }
}
gooogle-app app-content .search-item__text
{
    display: flex;
    flex-direction: column;

    width: 100%; 

    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: stretch;
}
gooogle-app app-content .search-item__text .name
{
    font-size: 14px;
    line-height: 20px;

    display: block;

    white-space: nowrap; 

    color: #202124;
}
gooogle-app app-content .search-item__text .link
{
    font-size: 12px;
    font-style: normal; 
    line-height: 1;

    color: #828282;
}
gooogle-app app-content .search-item__text .link:after
{
    font-size: 16px;

    display: inline-block; 

    margin-left: 7px;

    content: '\2807';
}
@media screen and (max-width: 1000px)
{
    gooogle-app app-content .search-item__text .link
    {
        position: relative;
    }
    gooogle-app app-content .search-item__text .link:after
    {
        position: absolute;
        right: 0;
    }
}
@media screen and (max-width: 1000px)
{
    gooogle-app app-content .search-item__text .link,
    gooogle-app app-content .search-item__text .name
    {
        line-height: 20px;
    }
    gooogle-app app-content .search-item__text .name
    {
        font-size: 16px;
    }
    gooogle-app app-content .search-item__text .link
    {
        font-size: 14px;
    }
}
gooogle-app app-content .search-item__title
{
    font-family: 'Inter', sans-serif;
    font-size: 20px;
    line-height: 24px; 

    color: #1718a4;
}
@media screen and (max-width: 1000px)
{
    gooogle-app app-content .search-item__title
    {
        color: #1558d6;
    }
}
gooogle-app app-content .search-item p
{
    font-family: Arial, sans-serif;
    font-size: 14px;

    margin-bottom: 0; 

    color: #202124;
}
@media screen and (min-width: 1001px)
{
    gooogle-app app-content .search-item
    {
        margin-bottom: 30px;
    }
    gooogle-app app-content .search-item:hover .search-item__title
    {
        text-decoration: underline;
    }
}
@media screen and (max-width: 1000px)
{
    gooogle-app app-content .search-item
    {
        margin-bottom: 8px;
        padding: 15px 18px 12px;

        background: white;
        box-shadow: 0 0 0 1px #ebedef;
    }
}
gooogle-app app-footer
{
    width: 100%;
    max-width: 652px;
}
gooogle-app app-footer .pagination
{
    display: flex;
    flex-direction: row;

    padding: 50px 0; 

    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
}

.side-info
{
    font-family: Arial;
    font-weight: 400; 

    width: 100%;

    background: white;
}
@media screen and (max-width: 1000px)
{
    .side-info
    {
        margin-bottom: 8px; 
        padding: 15px 18px 12px;
    }
}
@media screen and (min-width: 1001px)
{
    .side-info
    {
        position: absolute;
        top: 0; 
        right: calc(-475px - 55px);

        max-width: 475px;
        padding-left: 25px;

        border-left: 1px solid #dadce0;
    }
}
.side-info__header
{
    font-family: Arial; 

    display: flex;
    flex-direction: row;

    margin-bottom: 24px;

    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: stretch;
}
@media screen and (max-width: 1000px)
{
    .side-info__header
    {
        flex-direction: row-reverse; 

        align-items: center;
        justify-content: space-between;
    }
}
.side-info__logo
{
    width: 56px;
    height: 56px;
    margin-right: 14px;

    border-radius: 5px;
}
@media screen and (max-width: 1000px)
{
    .side-info__logo
    {
        width: 40px;
        height: 40px; 
        margin-right: 0;
        margin-left: 14px;
    }
}
.side-info__title
{
    font-size: 28px;
    line-height: 36px;
}
@media screen and (max-width: 1000px)
{
    .side-info__title
    {
        font-size: 26px;
        line-height: 32px;
    }
}
.side-info__subtitle
{
    font-size: 14px;
    line-height: 22px; 

    color: #4f4f4f;
}
@media screen and (max-width: 1000px)
{
    .side-info__subtitle
    {
        font-size: 12px;
        line-height: 18px;
    }
}
.side-info__subtitle:after
{
    font-size: 16px;

    display: inline-block; 

    margin-left: 7px;

    content: '\2807';
}
.side-info__description
{
    font-size: 14px;
    line-height: 22px;

    margin-bottom: 24px; 
    padding: 12px 16px;

    color: #202124;
    border-radius: 12px;
    background-color: #e8eaed;
}
.side-info__url
{
    display: flex;
    display: inline-flex;
    flex-direction: row;

    height: 34;
    margin-bottom: 24px; 
    padding: 6px 12px;

    border: 1px solid #dadce0;
    border-width: 1px;
    border-radius: 28px;

    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
}
.side-info__url img
{
    width: 20px;
    height: 20px;
    margin-right: 10px;
}
.side-info__row-wrapper
{
    padding-top: 24px;

    border-top: 1px solid #dadce0;
}
@media screen and (max-width: 1000px)
{
    .side-info__row-wrapper
    {
        position: relative; 

        padding-top: 28px;

        border-top: none;
    }
    .side-info__row-wrapper::before
    {
        position: absolute;
        top: 0;
        left: -15px;

        display: block;

        width: calc(100% + 30px);
        height: 8px;

        content: '';

        background-color: #e8eaed;
    }
}
.side-info__row
{
    font-size: 14px;
    line-height: 1.4; 

    margin-bottom: 12px;
}
.side-info__label
{
    font-weight: 700;

    margin-right: 2px; 

    white-space: nowrap;

    color: #202124;
}
.side-info__value
{
    color: #4f4f4f;
}
.side-info__search-more
{
    margin-top: 24px;
    padding-top: 16px; 

    border-top: 1px solid #dadce0;
}
.side-info__search-title
{
    font-size: 16px;
    font-weight: 500;

    margin: 0 0 16px 0; 

    color: #202124;
}
.side-info__alternatives
{
    display: flex;
    overflow-x: auto; 
    flex-direction: row;

    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: flex-start;
}
.side-info__alternatives::-webkit-scrollbar
{
    display: none;
}
.side-info__alternatives .alternative-item
{
    width: 100px;
}
@media screen and (max-width: 1000px)
{
    .side-info__alternatives .alternative-item
    {
        min-width: 85px;
    }
}
.side-info__alternatives .alternative-item img
{
    width: 84px;
    height: 84px;
}
@media screen and (max-width: 1000px)
{
    .side-info__alternatives .alternative-item img
    {
        width: 75px;
        height: 75px;
    }
}
.side-info__alternatives .alternative-item span
{
    font-size: 14px;
    line-height: 20px; 

    white-space: wrap;
}
.side-info__alternatives .alternative-item:hover
{
    text-decoration: underline;
}

.video-block
{
    font-family: Arial, sans-serif;

    margin-bottom: 40px;

    background-color: white;
}
@media screen and (max-width: 1000px)
{
    .video-block
    {
        margin-bottom: 8px; 
        padding: 15px 18px 25px;
    }
}
.video-block__title
{
    font-size: 22px;
    font-weight: 500;
    line-height: 28px; 

    color: #202124;
}
.video-block__title:after
{
    font-size: 16px;

    display: inline-block; 

    margin-left: 7px;

    content: '\2807';
}
@media screen and (max-width: 1000px)
{
    .video-block__title:after
    {
        float: right;
    }
}
.video-block__content
{
    display: flex;
    flex-direction: column;

    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: stretch;
}
.video-block .video-item
{
    display: flex;

    width: 100%; 
    height: -moz-fit-content;
    height:      fit-content;
    padding: 12px 0;

    transition: height .3s;
}
.video-block .video-item:not(:first-child)
{
    border-top: 1px solid #dadce0;
}
.video-block .video-item__link-info
{
    display: flex;

    flex: 1;
}
.video-block .video-item__thumbnail
{
    position: relative; 

    overflow: hidden;

    width: 148px;
    height: 83px;

    border-radius: 8px;

    flex-shrink: 0;
}
.video-block .video-item__thumbnail img
{
    width: 100%;
    height: 100%;

    -o-object-fit: cover;
       object-fit: cover;
}
@media screen and (max-width: 1000px)
{
    .video-block .video-item__thumbnail
    {
        width: 136px;
        height: 75px;
    }
}
.video-block .video-item__info
{
    display: flex;
    flex-direction: column;

    box-sizing: border-box;
    width: 0; 
    padding-left: 20px;

    flex-grow: 1;
    justify-content: space-between;
}
.video-block .video-item__title
{
    font-size: 16px;
    font-weight: normal;
    line-height: 20px;

    overflow: hidden;

    margin: 0;

    white-space: nowrap; 
    text-overflow: ellipsis;

    color: #1718a4;
}
@media screen and (max-width: 1000px)
{
    .video-block .video-item__title
    {
        display: -webkit-box;

        white-space: normal;
        word-break: break-word;

        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }
}
.video-block .video-item__title:hover
{
    text-decoration: underline;
}
.video-block .video-item__meta
{
    font-size: 14px;
    font-weight: 400;
    line-height: 22px; 

    display: flex;
    flex-direction: column;

    color: #828282;

    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
}
@media screen and (max-width: 1000px)
{
    .video-block .video-item__meta
    {
        font-size: 12px;
        line-height: 18px;
    }
}
.video-block .video-item__meta .source
{
    overflow: hidden;

    max-width: 100%; 

    white-space: nowrap;
    text-overflow: ellipsis;

    color: #828282;
}
.video-block .video-item__meta .date
{
    color: #828282;
}
.video-block__more
{
    position: relative;
    z-index: 1;

    margin-top: 18px;

    text-align: center;

    color: #202124;
}
.video-block__more a
{
    position: relative;
    z-index: 1; 

    display: flex;
    flex-direction: row;

    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
}
.video-block__more a:before
{
    position: absolute;
    z-index: -1; 
    top: 50%;
    left: 50%;

    width: 300px;
    min-width: -moz-fit-content;
    min-width:      fit-content;
    height: 36px;

    content: '';
    transform: translate(-50%, -50%);

    border-radius: 18px;
    background-color: #dadce0;
}
.video-block__more a:hover:before
{
    background-color: #d8d7dc;
}
@media screen and (max-width: 1000px)
{
    .video-block__more a:before
    {
        width: 100%;
    }
}
.video-block__more-arrow
{
    display: inline-block;

    width: 20px;
    height: 20px;
    margin-left: 8px;
}
.video-block__more-arrow svg
{
    width: 100%;
    max-width: 100%;
    height: 100%;
    max-height: 100%;
    margin-left: 4px; 

    fill: #828282;
}
@media screen and (max-width: 1000px)
{
    .video-block__more-arrow:after
    {
        position: relative;
        top: -4px; 

        display: inline-block;

        padding: 3px;

        content: '';
        transform: rotate(45deg);

        border: solid #828282;
        border-width: 0 2px 2px 0;
    }
    .video-block__more-arrow svg
    {
        display: none;
    }
}
.video-block__more:after
{
    position: absolute;
    z-index: -1; 
    top: 50%;
    left: 0;

    width: 100%;
    height: 1px;

    content: '';

    background-color: #dadce0;
}

/*! CSS Used fontfaces */
@font-face
{
    font-family: 'Inter';
    font-weight: 100 900;
    font-style: italic;

    font-display: swap;
    src: url(https://fonts.gstatic.com/s/inter/v18/UcCm3FwrK3iLTcvnUwkT9nA2.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face
{
    font-family: 'Inter';
    font-weight: 100 900;
    font-style: italic;

    font-display: swap;
    src: url(https://fonts.gstatic.com/s/inter/v18/UcCm3FwrK3iLTcvnUwAT9nA2.woff2) format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face
{
    font-family: 'Inter';
    font-weight: 100 900;
    font-style: italic;

    font-display: swap;
    src: url(https://fonts.gstatic.com/s/inter/v18/UcCm3FwrK3iLTcvnUwgT9nA2.woff2) format('woff2');
    unicode-range: U+1F00-1FFF;
}

@font-face
{
    font-family: 'Inter';
    font-weight: 100 900;
    font-style: italic;

    font-display: swap;
    src: url(https://fonts.gstatic.com/s/inter/v18/UcCm3FwrK3iLTcvnUwcT9nA2.woff2) format('woff2');
    unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}

@font-face
{
    font-family: 'Inter';
    font-weight: 100 900;
    font-style: italic;

    font-display: swap;
    src: url(https://fonts.gstatic.com/s/inter/v18/UcCm3FwrK3iLTcvnUwsT9nA2.woff2) format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face
{
    font-family: 'Inter';
    font-weight: 100 900;
    font-style: italic;

    font-display: swap;
    src: url(https://fonts.gstatic.com/s/inter/v18/UcCm3FwrK3iLTcvnUwoT9nA2.woff2) format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face
{
    font-family: 'Inter';
    font-weight: 100 900;
    font-style: italic;

    font-display: swap;
    src: url(https://fonts.gstatic.com/s/inter/v18/UcCm3FwrK3iLTcvnUwQT9g.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face
{
    font-family: 'Inter';
    font-weight: 100 900;
    font-style: normal;

    font-display: swap;
    src: url(https://fonts.gstatic.com/s/inter/v18/UcCo3FwrK3iLTcvvYwYL8g.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face
{
    font-family: 'Inter';
    font-weight: 100 900;
    font-style: normal;

    font-display: swap;
    src: url(https://fonts.gstatic.com/s/inter/v18/UcCo3FwrK3iLTcvmYwYL8g.woff2) format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face
{
    font-family: 'Inter';
    font-weight: 100 900;
    font-style: normal;

    font-display: swap;
    src: url(https://fonts.gstatic.com/s/inter/v18/UcCo3FwrK3iLTcvuYwYL8g.woff2) format('woff2');
    unicode-range: U+1F00-1FFF;
}

@font-face
{
    font-family: 'Inter';
    font-weight: 100 900;
    font-style: normal;

    font-display: swap;
    src: url(https://fonts.gstatic.com/s/inter/v18/UcCo3FwrK3iLTcvhYwYL8g.woff2) format('woff2');
    unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}

@font-face
{
    font-family: 'Inter';
    font-weight: 100 900;
    font-style: normal;

    font-display: swap;
    src: url(https://fonts.gstatic.com/s/inter/v18/UcCo3FwrK3iLTcvtYwYL8g.woff2) format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face
{
    font-family: 'Inter';
    font-weight: 100 900;
    font-style: normal;

    font-display: swap;
    src: url(https://fonts.gstatic.com/s/inter/v18/UcCo3FwrK3iLTcvsYwYL8g.woff2) format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face
{
    font-family: 'Inter';
    font-weight: 100 900;
    font-style: normal;

    font-display: swap;
    src: url(https://fonts.gstatic.com/s/inter/v18/UcCo3FwrK3iLTcviYwY.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

.bottom-block
{
    font-family: Arial;
    font-weight: 400;

    background: white;
}
@media screen and (max-width: 1000px)
{
    .bottom-block
    {
        margin-bottom: 8px; 
        padding: 15px 18px 12px;
    }
}
.bottom-block__title
{
    font-size: 22px;
    line-height: 28px;

    margin-bottom: 8px;
}
.bottom-block__title:after
{
    font-size: 16px;

    display: inline-block; 

    margin-left: 7px;

    content: '\2807';
}
.bottom-block__container
{
    display: grid;

    grid-template-columns: repeat(2, 1fr);
    -moz-column-gap: 16px;
         column-gap: 16px;
}
@media screen and (max-width: 600px)
{
    .bottom-block__container
    {
        grid-template-columns: repeat(1, 1fr);
    }
}
.bottom-block__item
{
    position: relative;

    display: flex;
    flex-direction: row;

    height: 52px;
    margin: 4px 0 4px 0; 
    padding: 0 8px 0 16px;

    border-radius: 8px;
    background: #f7f8f9;

    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
}
.bottom-block__item-text
{
    font-size: 14px;
    font-weight: bold; 
    line-height: 20px;

    margin-right: 28px;

    color: #202124;
}
.bottom-block__item-text .term
{
    font-weight: normal; 

    color: #4f4f4f;
}
.bottom-block__item:hover
{
    text-decoration: underline;
}
.bottom-block__item-icon
{
    position: absolute;
    top: 50%;
    right: 8px;

    display: flex;

    padding-right: 7px; 
    padding-left: 9px;

    transform: translateY(-50%);

    align-items: center;
}
.bottom-block__item-icon svg
{
    width: 20px;
    height: 20px;

    fill: #70757a;
}

.otgs-development-site-front-end
{
    display: none;
}