/* Style the app of data for function selected navigation by browser's */
.AppDataBrowserNavigationSelect {
    display: none;

    z-index: 11;

    width: 100%;
}

    .AppDataBrowserNavigationSelect__Top {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;

        background: rgb(255, 255, 255);

        width: 100%;

        position: absolute;
        top: 0px;
        left: 0px;
        z-index: 1;

        padding-top: var(--size-17);
        padding-bottom: var(--size-17);

        transition: 0.4s;
    }

    @media screen and (max-width: 900px){
        .AppDataBrowserNavigationSelect__Top {
            border-bottom-left-radius: var(--size-07);
            border-bottom-right-radius: var(--size-07);

            padding: 1.7vw;
        }
    }

        .AppDataBrowserNavigationSelect__Top > button,
        .AppDataBrowserNavigationSelect__Top > a {
            padding: var(--size-04);
            margin-right: var(--size-04);

            box-sizing: content-box;
        }

        @media screen and (max-width: 900px){
            .AppDataBrowserNavigationSelect__Top > button,
            .AppDataBrowserNavigationSelect__Top > a {
                padding: var(--size-02);
            }
        }

        .AppDataBrowserNavigationSelectTop__Header {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: flex-start;

            width: 100%;
        }

        @media screen and (max-width: 900px){
            .AppDataBrowserNavigationSelectTop__Header {
                border: unset;
                border-radius: unset;

                padding: unset;
            }
        }

            .AppDataBrowserNavigationSelectTopHeader__Title {
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: flex-start;

                text-align: left;
                white-space: normal;

                width: 100%;
            }

            @media screen and (max-width: 900px){
                .AppDataBrowserNavigationSelectTopHeader__Title > h6 {
                    font-size: var(--font-size);
                }
            }

                @media screen and (max-width: 650px){
                    .AppDataBrowserNavigationSelectTopHeader__Title > h6 {
                        font-size: var(--font-size-context);
                    }
                }

            .AppDataBrowserNavigationSelectTopHeader__Icon {
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;

                margin-right: var(--size-04);
            }

                .AppDataBrowserNavigationSelectTopHeader__Icon > img {
                    width: var(--icon-button-size-options);
                    height: auto;
                    max-width: var(--icon-button-size-options);
                }

            .AppDataBrowserNavigationSelect__Top > .AppPatternsTools > button {
                    padding: var(--size-07);
                }

                @media screen and (max-width: 900px){
                    .AppDataBrowserNavigationSelect__Top > .AppPatternsTools > button {
                        padding: var(--size-05);
                    }
                }

                    .AppDataBrowserNavigationSelect__Top > .AppPatternsTools > .AppPatternsTools__Links {
                        top: calc( var(--size-17) * 1.65 );
                    }

                    @media screen and (max-width: 900px){
                        .AppDataBrowserNavigationSelect__Top > .AppPatternsTools > .AppPatternsTools__Links {
                            top: calc( var(--size-17) * 1.4 );
                        }
                    }

    .AppDataBrowserNavigationSelect__Bottom {
        display: none;
        flex-direction: row;
        align-items: center;
        justify-content: flex-end;

        background: rgb(255, 255, 255);
        border-top: 1px solid rgb(237, 237, 237);

        width: 100%;

        z-index: 1;

        padding-top: var(--size-07);
        padding-bottom: var(--size-07);
        padding-left: 1.7vw;
        padding-right: 1.7vw;
    }

    @media screen and (max-width: 900px){
        .AppDataBrowserNavigationSelect__Bottom {
            border-top-left-radius: var(--size-07);
            border-top-right-radius: var(--size-07);
            border-top: unset;

            padding-top: 1.7vw;
            padding-bottom: 1.7vw;

            box-shadow: 0px -7px 47px rgba(57, 57, 57, 0.17);
        }

    }

    .AppDataBrowserNavigationSelect__Bottom > button {
        margin-left: var(--size-07);
    }

    @media screen and (max-width: 900px){
        .AppDataBrowserNavigationSelect__Bottom > button {
            flex-direction: column;
            justify-content: center;

            border: 1px dotted rgb(227, 227, 227);

            width: 100%;
            max-width: 31%;
        }

            .AppDataBrowserNavigationSelectBottom__ButtonLeft {
                border-bottom-left-radius: calc(var(--size-07) * 1.5) !important;
            }

            .AppDataBrowserNavigationSelectBottom__ButtonRight {
                border-bottom-right-radius: calc(var(--size-07) * 1.5) !important;
            }

            .AppDataBrowserNavigationSelect__Bottom > button > img {
                margin-right: unset;
            }

        .AppDataBrowserNavigationSelect__Bottom > .ButtonActive {
            border: unset;
        }

    }

        .AppDataBrowserNavigationSelect__Bottom > button:nth-of-type(1) {
            margin-left: unset;
        }

        @media screen and (max-width: 650px){
            .AppDataBrowserNavigationSelect__Bottom > button {
                font-size: calc(var(--font-size-context) / 1.2);

                padding: var(--size-04);
            }

                .AppDataBrowserNavigationSelect__Bottom > button > img {
                    margin-right: unset;
                }

        }