@charset "UTF-8";

/*@font-face {*/
/*    font-family: Lishu;*/
/*    src: url(chinese_font_lishu.ttf);*/
/*}*/

/*@font-face {*/
/*    font-family: Simkai;*/
/*    src: url(chinese_font_simkai.ttf);*/
/*}*/

:root {
    /* --border-gray: #e0e0e0; */
    --border-gray: #F1F1F1;
    --burnt-orange: #b5711a;
    --font-orange: #ce8732;
    --color-lotus-yellow: #FED000;
    --font-default-color: #252222;
    --font-blue: #4571bb;
    --font-navy: #223c67;
    --font-lightgray: #a7a7a7;
    --bg-lightgray: #fafafa;
    --font-default-family: "freight-text-pro", serif;
    --color-golden: #cbb7a3;
    --font-title-hover: var(--font-blue);
    --font-title-link-darkgray: #252222;
    --font-title-hover-lighterdarkgray: #514c4c;
    --site-stripe-blue: rgb(37, 64, 143);
    --site-stripe-lighter-blue: #2063E1;
}

.invert-white-img {
    filter: invert(81%);
}

.english-font {
    font-family: Georgia, "Times New Roman", Times, serif;
}

.font-size-16 {
    font-size: 16px;
}

#site-stripe-mobile {
    display: none;
}

#banner-menu-mobile {
    display: none;
}

.mobile-menu-container {
    display: none;
}

.footer {
    display: flex !important;
    justify-content: space-between !important;
    gap: 2em !important;
}

.footer_middle li {
    white-space: nowrap !important;
}

@media all and (max-width: 800px)   {

    html body #banner-menu {
        display: none;
    }

    #header {
    	display: none;
    }
    
    html body #searchbox {
        display: none;
        padding-right: 1em;
        margin-top: 8px;
    }

    .menubar_links {
        display: none;
    }

    #banner-menu-mobile {
        display: block;
    }

    /* Banner menu mobile */
    #banner-menu-mobile img {
        width: 100%;
        height: auto;
    }

    * {
        margin: 0;
        padding: 0;
    }

    /* TODO put back the overflow-x hidden*/
    html {
        /*-ms-text-size-adjust: 100%;*/
        /*-webkit-text-size-adjust: 100%;*/
        /*overflow-x: hidden;*/
    }

    body {
        font-size: 16px;
        line-height: 1.4;
        /* font-family: var(--font-default-family); */
        overflow-x: hidden;
        letter-spacing: 0.018em;
    }

    #topsection-mobile {
        /* margin-top: 36px; */
        /*height:24px;*/
    }

    #toplink-mobile {
        display: inline-block;
        z-index: 999;
        margin-left: 780px;
    }

    #searchbox-mobile {
        position: relative;
        top: -30px;
        height: 22px;
        width: 180px;
        margin-left: 760px;
        background-color: #ccccff;
        margin-top: 4px;
    }


    /*---Site Stripe---*/
    #site-stripe-mobile {
        display: flex;
        justify-content: space-between;
        width: 100%;
        background-color: var(--site-stripe-blue);
    }

    #site-stripe-container {
        display: flex;
        height: 36px;
        width: 100%;
        justify-content: space-between;
    }

    #site-stripe-mobile #site-stripe-external-links {
        margin-right: 10px;
    }

    #site-stripe-mobile #site-stripe-external-links div {
        display: inline;
    }

    .site-stripe-item {
        display: inline;
        padding-left: 0.5em;
        font-family: Simhei;
        font-size: 18px;
        line-height: 35px;
        color: white;
    }


    .site-stripe-item a {
        color: white;
    }

    .site-stripe a {
        color: white;
    }

    .other-languages-link a {
        /*         color: var(--font-orange); */
    }


    #globalsearch {
        position: relative;
        top: 8px;
        right: 9px;
        /*width: 168px;*/
        height: 24px;
        display: block;
    }

    #searchQuery {
        /* display: none; */
        font-size: 12px;
        color: #686;
        width: 164px;
        float: left;
        padding: 1px 0 0 4px;
        border: none;
        border-radius: 2px;
        height: 20px;
    }

    #cse-search-box {
        display: flex;
    }

    .searchsubmit {
        background: url(../images/common/search_btn-ok.png) 0 0 no-repeat;
        background-size: 12px;
        border: 0;
        width: 14px;
        height: 14px;
        display: block;
        font-size: 0;
        font-weight: 700;
        text-indent: -9999px;
        margin-top: 4px;
        margin-left: 4px;
        cursor: pointer;
    }

    .searchsubmit:hover {
        background: url(../images/common/search_btn-ok.png) 0 0 no-repeat;
        background-size: 12px;
        border: 0;
        width: 14px;
        height: 14px;
        display: block;
        font-size: 0;
    }

    /*-------- END SEARCH ------ */
    /* header search
    ---------------------------------------------*/
    #search-button-mobile {
        display: none;
    }

    #menu-toggle {
        padding: 11px 11px;
    }

    #menu-toggle input {
        display: flex;
        width: 42px;
        position: absolute;
        cursor: pointer;
        opacity: 0;
        z-index: 2;
    }

    #menu-toggle span {
        display: flex;
        width: 25px;
        height: 2px;
        margin-bottom: 5px;
        position: relative;
        background: #ffffff;
        border-radius: 3px;
        z-index: 1;
        transform-origin: 5px 0;
        transition: transform 0.3s cubic-bezier(0.77, 0.2, 0.05, 1.0),
        background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0),
        opacity 0.55s ease;
    }

    #menu-toggle span:first-child {
        transform-origin: 0 0;
    }

    #menu-toggle span:nth-last-child(2) {
        transform-origin: 0 100%;
    }

    #menu-toggle input:checked ~ span {
        /* opacity: 1; */
        /* transform: rotate(45deg) translate(-8px, -8px); */
        width: 24px;
    }

    #menu-toggle input:checked ~ span:nth-last-child(3) {
        /* opacity: 0; */
        /* transform: rotate(0deg) scale(0.2, 0.2); */
        width: 11px;
    }

    #menu-toggle input:checked ~ span:nth-last-child(2) {
        /* transform: rotate(-45deg) translate(-6px, 7px); */
        width: 18px;
    }

    #mobile-menu {
        position: fixed;
        top: 0;
        width: 100%;
        height: 100vh;
        margin: 36px 0 0 0;
        padding-bottom: 210px;
        background-color: var(--bg-lightgray);
        -webkit-font-smoothing: antialiased;
        transform-origin: 0 0;
        transform: translate(-100%, 0);
        transition: transform 0.3s cubic-bezier(0.77, 0.2, 0.05, 1.0);
        z-index: 300;
        overflow: scroll;
    }

    #mobile-menu li {
        border-top: 1px solid var(--border-gray);
    }

    #mobile-menu li:first-child {
        border-top: none;
    }

    #mobile-menu li:last-child {
        padding-bottom: 5em;
    }

    .mobile-menu-container #mobile-menu a {
        display: block;
        opacity: 1;
        text-decoration: none;
        color: var(--font-blue);
        font-size: 1.3em;
        transition: 200ms;
        padding: 1em 1.5em;
    }

    .mobile-menu-container {
        display: flex;
        flex-direction: column;
        justify-content: center;
        background-repeat: no-repeat, no-repeat;
        background-position: left, right;
        background-color: var(--site-stripe-blue);
    }

    .mobile-menu-container #mobile-menu li a span img {
        filter: invert(81%);
        height: 1.5em;
    }

    .mobile-menu-container #mobile-menu li a span {
        margin-left: 0;
    }

    .language-items {
        display: none;
    }

    .language-items a {
        display: block;
        padding: 1em 3em !important;
        border-top: 1px solid var(--border-gray);
    }

    .language-items li.language-item {
        border-top: none !important;
    }

    .language-select-toggle img {
        height: 1.8em !important;
    }

    .language-select-other-languages {
        display: inline-block;
        color: black;
        vertical-align: top;
        padding-top: 5px;
    }

    #footer {
        width: 100%;
    }

    .footer_left {
        width: auto;
    }

    .footer_middle {
        margin-left: 0;
    }

}

@media all and (max-width: 800px)    {

    #cse-search-box {
        display: none;
    }

    #search-button-mobile {
        display: block;
    }

    .footer {
        height: auto;
        flex-wrap: wrap;
        margin: 0;
        padding-left: 1.5em;
        padding-right: 1.5em;
        padding-bottom: 2em;
        background: rgb(0,132,247);
    }


    .footer_left {
        margin-left: 0;
    }

    .footer_list1 {
        /*color: var(--color-lotus-yellow) !important;*/
        color: var(--font-orange) !important;
    }

    .footer_list1 a {
        color: var(--font-orange) !important;
    }

    .footer_middle {
        /*display: none;*/
    }

}


@media all and (max-width: 600px) {

    .footer_middle div {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr);
    }

    .footer_middle .footercol2 {
        /*margin-left: 0px;*/
    }

    .footer_middle .footercol4 {
        margin-left: 0;
    }

}