﻿/*@charset "UTF-8";

* {
    box-sizing: border-box;
}

html,
body {
    height: 100%;
}*/

/*body {
    background: #212121;
    background-image: url("https://images.unsplash.com/photo-1547132025-0868fd15d909?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2250&q=80");
    background-size: cover;
    padding: 0 16px;
}*/
/*
    body h1 {
        color: #fff;
        margin: 1em 0 0.5em 0;
        letter-spacing: -1px;
    }

    body h2 {
        color: #fff;
        margin: 0 0 1em 0;
        font-weight: 100;
        font-size: 1.8em;
        letter-spacing: -1px;
    }*/
/*
    body p {
        color: #fff;
    }

    body a {
        color: #fff;
    }*/

#google_translate_element {
    position: absolute;
    bottom: calc(0px + 10px);
    right: 210px !important;
}

.goog-te-gadget {
    font-family: Roboto, "Open Sans", sans-serif !important;
    text-transform: uppercase;
}

.goog-te-gadget-simple {
    background-color: rgba(255, 255, 255, 0.2) !important;
    border: 1px solid rgba(255, 255, 255, 0.5) !important;
    padding: 8px !important;
    border-radius: 4px !important;
    font-size: 1rem !important;
    line-height: 2rem !important;
    display: inline-block;
    cursor: pointer;
    zoom: 1;
}

.goog-te-menu2 {
    max-width: 100%;
}

.goog-te-menu-value {
    color: #fff !important;
}

    .goog-te-menu-value:before {
        font-family: "Material Icons";
        /*content: "";*/
        margin-right: 16px;
        font-size: 2rem;
        vertical-align: -10px;
    }

    .goog-te-menu-value span:nth-child(5) {
        /* display: none;*/
        color: #fff !important;
    }

    .goog-te-menu-value span:nth-child(3) {
        border: none !important;
        /*font-family: "Material Icons";*/
    }

        .goog-te-menu-value span:nth-child(3):after {
            /*font-family: "Material Icons";*/
            /*content: "";*/
            font-size: 1.5rem;
            vertical-align: -6px;
           /* background-image: url('/images/lang/world-icon.png') !important;
            background-position: center !important;
            background-repeat: no-repeat;
            background-size: 32px;*/
        }

.goog-te-gadget-icon {
    background-image: url('/images/lang/world-icon.png') !important;
    height: 32px !important;
    width: 32px !important;
    margin-right: 8px !important;
    /*display: none;*/
    background-position: center!important;
    background-repeat: no-repeat;
    background-size: 32px;
}

.goog-te-banner-frame.skiptranslate {
    display: none !important;
}

/* Ẩn banner skiptranslate khi chọn tiếng Việt */
.goog-te-banner-frame {
    display: none !important;
}

/* Ẩn tất cả banner Google Translate */
.goog-te-ftab, .goog-te-banner, .goog-te-banner-frame {
    display: none !important;
}

/* Ẩn banner "Skip translation" */
.skiptranslate {
    display: none !important;
}

/* Ẩn banner khi đang ở ngôn ngữ gốc */
body.translated-ltr .goog-te-banner-frame,
body.translated-rtl .goog-te-banner-frame {
    display: none !important;
}

/*.goog-te-menu2-item .indicator {
    display: inherit !important;
}

.goog-te-combo, .goog-te-banner *, .goog-te-ftab *, .goog-te-menu *, .goog-te-menu2 *, .goog-te-balloon * {
    font-size: 13pt!important;
    font-weight:600;
}*/

body {
    top: 0px !important;
}

/* Style cho select dropdown ngôn ngữ */
#select_language {
    background: rgba(255, 255, 255, 0.2) !important;
    border: 1px solid rgba(255, 255, 255, 0.5) !important;
    border-radius: 4px !important;
    padding: 8px 12px !important;
    color: #fff !important;
    font-family: Roboto, "Open Sans", sans-serif !important;
    font-size: 14px !important;
    cursor: pointer;
    outline: none;
    transition: all 0.3s ease;
}

#select_language:hover {
    background: rgba(255, 255, 255, 0.3) !important;
    border-color: rgba(255, 255, 255, 0.7) !important;
}

#select_language option {
    background: #0854c3 !important;
    color: #fff !important;
    padding: 8px !important;
}

.RightTopBar {
    display: flex;
    align-items: center;
}

/* ================================== *\
    Mediaqueries
\* ================================== */
@media (max-width: 667px) {
    #google_translate_element {
        bottom: calc(100% - 14% - 53px);
        left: 236px !important;
        width: 100% !important;
    }

        #google_translate_element goog-te-gadget {
            width: 100% !important;
        }

        #google_translate_element .skiptranslate {
            width: 100% !important;
        }

        #google_translate_element .goog-te-gadget-simple {
            width: calc(100% - 32px) !important;
            text-align: center;
        }
}
