/* ext begin */

.uk-progress::-webkit-progress-value {
    background-color: #4caf50;
    transition: width .6s ease;
}

.uk-progress::-moz-progress-bar {
    background-color: #4caf50;
}

.uk-progress::-ms-fill {
    background-color: #4caf50;
    transition: width .6s ease;
    border: 0;
}

.uk-progress.l4a-progress::-webkit-progress-value {
    background-color: #b2bec3;
    transition: width .6s ease
}

.uk-progress.l4a-progress::-moz-progress-bar {
    background-color: #b2bec3;
}

.uk-progress.l4a-progress::-ms-fill {
    background-color: #b2bec3;
    transition: width .6s ease;
    border: 0
}

.uk-margin-exsmall {
    margin: 4px
}

*+.uk-margin-exsmall {
    margin: 4px!important
}

.uk-margin-exsmall-top {
    margin-top: 4px!important
}

.uk-margin-exsmall-bottom {
    margin-bottom: 4px!important
}

.uk-margin-exsmall-left {
    margin-left: 4px!important
}

.uk-margin-exsmall-right {
    margin-right: 4px!important
}
.uk-padding-exsmall {
    padding: 8px
}
.uk-padding-exsmall-top {
    padding-top: 4px!important
}

.uk-padding-exsmall-bottom {
    padding-bottom: 4px!important
}

.uk-padding-exsmall-left {
    padding-left: 4px!important
}

.uk-padding-exsmall-right {
    padding-right: 4px!important
}
.uk-progress{
    height:8px;
}
/* ext end */

.dot{
    height: 1em; 
    width:1em;
    color: #BDBDBD;
}
.l4a-detail-left-nav>*>a{
    justify-content:flex-end;
    padding:0px;
}
.l4a-detail-left-nav>*>a:hover{
    font-weight: bolder;
}

.fa-margin-small-top{
    margin-top: 2px;
}
.l4a-margin-ssmall-right{
    margin-right: 6px;
}

.uk-label{
    text-transform:none;
}

.icon-gray {
    -webkit-filter: grayscale(100%); /* Chrome, Safari, Opera */
    filter: grayscale(100%);
}
.uk-section-muted .uk-thumbnav>*>::after {
    background: rgba(248,248,248,.9);
}

.uk-section-muted .uk-thumbnav>*>:hover::after{
    background: transparent;
}

.uk-section-default .uk-thumbnav>*>::after {
    background: rgba(255,255,255,.9);
}

.uk-section-default .uk-thumbnav>*>:hover::after{
    background: transparent;
}
h1{
    font-size: 1.2rem;
}
h2{
    font-size: 1rem;
}
h3{
    font-size: 0.875rem;
    line-height: 1.5;
}
.text-exsmall{
    font-size: 0.5rem;
}
.info-bg{
    background-color: #dfdfdf;
}
.uk-badge-warning {
    background-color: #f8f8f8;
    color: #BDBDBD!important;
    padding: 0 0.4rem;
}
a.link-info{
    color: #BDBDBD;
}
.text-tips{
    color: #BDBDBD;
}

/* https://www.cufonfonts.com/font/kufam-2 */
@font-face {
    font-family: "Kufam-SemiBold";
    src: url("../font/kufam/Kufam-SemiBold.ttf");
    font-display: swap;
}

.logo{
    font-size: 0;
}
.logo .en{
    font-family: 'Kufam-SemiBold', sans-serif;
    color: #fff;
    font-size: xx-large;
}

/* .logo .num{
    font-family: 'Jura', sans-serif;
    color: #4caf50;
    font-size: xxx-large;
    text-shadow:0 0 0.01em #fff,
    -0 -0 0.01em #fff;
} */


.logo .num{
    font-family: 'Kufam-SemiBoldItalic', sans-serif;
    color: #4caf50;
    font-size: xxx-large;
}

.tm-navbar-container:not(.uk-navbar-transparent) {
    background: #3f51b5;
    box-shadow: 0px 2px 4px -1px rgb(0 0 0 / 20%), 0px 4px 5px 0px rgb(0 0 0 / 14%), 0px 1px 10px 0px rgb(0 0 0 / 12%);
}

.uk-navbar-item{
    min-height: auto;
}

.uk-navbar-right .uk-navbar-item{
    padding: 0;
}
.uk-navbar-right .uk-navbar-item a{
    border-radius: 50%;
    padding: 10px;
    min-height: 20px;
    color: #fff;
}
.uk-navbar-right .uk-navbar-item a:hover{
    background-color: rgba(0, 0, 0, 0.04);
    text-decoration: none;
}

.curr-locale{
    max-width: 70px;
    height: 22px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: inline-flex;
}

h1:hover a{
    display: inline;
}
.uk-subnav>*>:first-child{
    text-transform:none;
}
.uk-tab>*>a{
    text-transform:none;
}

.sub-copy{
    height: 20px;
}
.uk-notification-message{
    padding: 0;
    background-color: transparent;
}
.uk-search-navbar{
    width: auto;
}
.uk-search-navbar [class*=uk-width]{
    max-width: initial;
}


.uk-width-custom-xsmall{
    flex: none;
    width: 45px;
    box-sizing: border-box;
    max-width: 100%;
}
h1 {
    font-size: 1.5rem;
}

.app-more{
    display: inline-flex;
    vertical-align: text-bottom;
    color: #BDBDBD;
    line-height:1.0;
}

.item-nav-wrap{
    padding: 8px 0;
    margin: 0;
    align-items: center;
    display: inline-flex;
    background: #f8f8f8;
}
#lang-nav-list a{
    color: #4caf50;
    text-decoration: none;
    cursor: pointer;
    padding: 2px 8px;
    margin: 4px 8px;
    display: inline-flex;
    border-radius: 5px;
    background-color: #f8f8f8;
    font-size: .875rem;
    line-height: 1.5;
    width: 16px;
    justify-content:center;
}
#lang-nav-list a:hover {
    text-decoration: underline;
}
.string-item-wrap{
    margin:0px 0 0px -15px!important;
    padding: 8px;
}

.string-item-wrap .left{
    padding: 0 4px 0 15px;
}


.string-item-wrap .left .apps{
    display: flow-root;
    position: relative;
    box-sizing: border-box;
    background: #f8f8f8;
    padding: 0px 8px 8px 8px;
}

.string-item-wrap .left .apps img{
    border-radius: 5px;
    width: 20px;
}

.string-item-wrap .left h2{
    margin: 4px!important;
    align-items: flex-end;
    display: flex;
    font-weight: bolder;
}

.string-item-wrap .left a{
    color: #636e72;
}
.string-item-wrap .left a:hover {
    color: #4caf50;
    text-decoration: underline;
}

.string-item-wrap .left a.app_list_bt
{
    width: 102px;
}

.string-item-wrap .left a.sub-copy, .string-item-wrap .left a.app_list_bt{
    color: #BDBDBD;
    height: 20px;
    margin: 0 0 0 14px!important;
    font-weight: 700;
    font-size: .875rem;
    line-height: 1.5;
}

.string-item-wrap .left a.sub-copy:hover, .string-item-wrap .left a.app_list_bt:hover {
    color: #4caf50;
    text-decoration: none;
}

.string-item-wrap .left a.app_list_bt i{
    margin-right: 4px!important;
}

.string-item-wrap .left .locales_wrap{
    display: inline-flex;
    margin-bottom: 0;
    margin-right: 10px!important;
    align-items: flex-end;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.string-item-wrap .left .locales_wrap > div{
    box-sizing: border-box;
    max-width: 51px;
    height: 18px;
    border-radius: 500px;
    vertical-align: middle;
    font-size: 11px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    line-height: 0;
    background-color: #f8f8f8;
    color: #BDBDBD!important;
    padding: 0 0.4rem;
}

.string-item-wrap .left .locales_wrap > span{
    line-height:1.0;
    margin: 0 4px;
    display: inline-flex;
    vertical-align: middle;
    color: #BDBDBD;
}

.string-item-wrap .right{
    padding: 0!important;
    margin: 0!important;
    align-items: center;
    justify-content: flex-start;
    display: flex;
}

.string-item-wrap .right .uk-width-5-6{
    margin-top: 10px!important;
    align-items: center;
    justify-content: center;
}
.string-item-wrap .right progress{
    height: 8px;
    margin: 0!important;
}

.string-item-wrap .right .times{
    color: #BDBDBD;
    font-size: 0.5rem;
    text-align: center!important;
    font-weight: 700;
}

.string-item-wrap .right .uk-width-1-6{
    align-items: center;
    justify-content: center;
    display: inline-flex;
}
.string-item-wrap .right .uk-width-1-6 span{
    color: #4caf50;
    text-align: center!important;
}

#lang-css{
    flex: 1;
    min-width: 1px;
}
.lang-cs{
    padding: 0!important;
    display: flow-root;
    box-sizing: border-box;
}
.lang-cs .title{
    color: #BDBDBD;
    padding: 8px;
    margin: 0!important;
    background: #f8f8f8;
    display: flow-root;
    box-sizing: border-box;
}
.lang-cs .title i{
    color: #BDBDBD;
    margin-right: 10px!important;
}
.lang-cs .show-more-items-bt{
    color: #BDBDBD;
    font-size: .5rem;
    line-height: 18px;
    height: 18px;
    align-items: baseline;
    justify-content: center;
    display: flex;
    margin-top: -4px;
}
.lang-cs .show-more-items-bt:hover{
    text-decoration: none;
}
.lang-cs .show-more-items-bt i{
    margin-right: 4px;
}


/* right-side-wrap */
.right-side-wrap{
    margin-bottom: 10px!important;
}
.right-side-wrap h2{
    padding: 8px;
    margin: 0!important;
    align-items: center;
    background: #f8f8f8;
    display: flow-root;
    font-size: 16px;
    font-weight: bolder;
}

.right-side-wrap h2 i{
    color: #BDBDBD;
    margin-right: 10px!important;
}

.right-side-wrap .content{
    padding: 8px;
    margin: 0!important;
    align-items: center;
    display: flow-root;
}

.right-side-wrap .content ul{
    margin: 0!important;
}

.right-side-wrap .content ul li{
    display: flex;
    position: relative;
    max-width: 100%;
    vertical-align: middle;
    -webkit-backface-visibility: hidden;
}

.right-side-wrap .content ul>::before {
    width: 0;
}

.right-side-wrap .content ul li a.title{
    flex: 1;
    min-width: 1px;
    color: inherit;
}

.right-side-wrap .content ul li a.title h3{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin: 0!important;
}

.right-side-wrap .content ul li a.count{
    flex: none;
    width: 51px;
    box-sizing: border-box;
    max-width: 100%;
    color: #BDBDBD;
}
.right-side-wrap .content ul li a.count:hover{
    color: #4caf50;
    text-decoration: none;
}
.right-side-wrap .content ul li a.count i{
    margin-right: 4px!important;
}
.copy{
    margin-left: 10px!important;
    color: #BDBDBD;
    font-weight: 700;
    font-size: .875rem;
    line-height: 1.5;
}
.copy:hover{
    color: #4caf50;
    text-decoration: none;
}
.introduce-tips{
    color: #636e72!important;
    text-align: center!important;
    padding: 8px 20px;
    font-weight: 700;
    font-size: 1.5rem;
    line-height: 1.5;
}
.string-title, .right-side-item-title{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

hr.sp{
    margin: 10px 0!important;
}

#lang-nav-list{
    margin-top: 5px;
}
.uk-search-icon{
    font-size: x-large;
    opacity:0.6;
}

.uk-search-icon:hover{
    text-decoration: none;
}

.search-lang-list > div, .search-lang-list > div a{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.uk-search .uk-button{
    text-transform:none;
}

.search-lang-list-wrap{
    border: 1px solid #3f51b5;
}

.footer-wrap{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-left: -20px;
    padding: 0;
    list-style: none;
    column-gap: .25em;
    color: #636e72;
    font-size: .875rem;
}

.footer-wrap .email{
    color: #BDBDBD;
}

.footer-wrap li:not(.uk-first-column)::before {
    content: "";
    margin-left: 10px;
    height: 10px;
    display: inline-block;
    vertical-align: middle;
}

@media (min-width: 640px) {
    .footer-wrap li:not(.uk-first-column)::before {
        content: "";
        margin-left: 10px;
        padding-left: 10px;
        border-left: 1px solid #c0c4cc;
        height: 10px;
        display: inline-block;
        vertical-align: middle;
    }
    
    .footer-wrap .email{
        color: #636e72;
    }
}


.footer-wrap a{
    color: #636e72;
}
.footer-wrap a:hover{
    text-decoration: none;
}

.support-locales-dropdown{
    padding: 20px!important;
}

.tippy-box {
    padding: 2px 8px;
    transform:scaleX(1);
    cursor: pointer;
    animation: tada 1s linear;
}

.tippy-box[data-animation=scale][data-placement^=top]{transform-origin:bottom}.tippy-box[data-animation=scale][data-placement^=bottom]{transform-origin:top}.tippy-box[data-animation=scale][data-placement^=left]{transform-origin:right}.tippy-box[data-animation=scale][data-placement^=right]{transform-origin:left}.tippy-box[data-animation=scale][data-state=hidden]{transform:scale(.5);opacity:0}

.tippy-box[data-theme~='l4a'] {
    background-color: #4caf50;
    color: #fff;
}

.tippy-box[data-theme~='l4a'][data-placement^='bottom'] > .tippy-arrow::before {
    border-bottom-color: #4caf50;
}
.tippy-box[data-theme~='l4a'][data-placement^='right'] > .tippy-arrow::before {
    border-right-color: #4caf50;
}

.tippy-box[data-theme~='l4a-warning'] {
    background-color: #b2bec3;
    color: #fff;
}

.tippy-box[data-theme~='l4a-warning'][data-placement^='bottom'] > .tippy-arrow::before {
    border-bottom-color: #b2bec3;
}
.tippy-box[data-theme~='l4a-warning'][data-placement^='right'] > .tippy-arrow::before {
    border-right-color: #b2bec3;
}


@keyframes tada { 
    10%,20%{transform:scale3d(.9,.9,.9) rotate(-3deg)}
    30%,50%,70%,90%{transform:scale3d(1.1,1.1,1.1) rotate(3deg)}
    40%,60%,80%{transform:scale3d(1.1,1.1,1.1) rotate(-3deg)}
}

@-moz-keyframes tada { 
    10%,20%{transform:scale3d(.9,.9,.9) rotate(-3deg)}
    30%,50%,70%,90%{transform:scale3d(1.1,1.1,1.1) rotate(3deg)}
    40%,60%,80%{transform:scale3d(1.1,1.1,1.1) rotate(-3deg)}
}

@-webkit-keyframes tada { 
    10%,20%{transform:scale3d(.9,.9,.9) rotate(-3deg)}
    30%,50%,70%,90%{transform:scale3d(1.1,1.1,1.1) rotate(3deg)}
    40%,60%,80%{transform:scale3d(1.1,1.1,1.1) rotate(-3deg)}
}

@-o-keyframes tada { 
    10%,20%{transform:scale3d(.9,.9,.9) rotate(-3deg)}
    30%,50%,70%,90%{transform:scale3d(1.1,1.1,1.1) rotate(3deg)}
    40%,60%,80%{transform:scale3d(1.1,1.1,1.1) rotate(-3deg)}
}