.ai-flag-list .ai-flag {
    display: block;
    cursor: pointer;
    border-radius: 4px;
}

.ai-flag-list .ai-flag canvas {
    display: block;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    border: 1px solid #d2d2d2;
    padding: 5px;
}

[data-ai-translator],
[data-ai-translator-button] {
    cursor: pointer;
}

.ai-translator-dropdown-wrap {
    position: relative;
}

.ai-translator-dropdown {
    position: absolute;
    z-index: 1;
    top: calc(100% + 5px);
    left: 50%;
    transform: translateX(-50%);
    width: 200px;
    min-width: 200px;
    height: auto;
    max-height: 300px;
    border: 1px solid #d2d2d2;
    border-radius: 4px;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.175);
    background: #fff;
    display: none !important;
}

.ai-translator-dropdown.active {
    display: block !important;
}

.ai-translator-dropdown ul {
    display: block;
    padding: 0 !important;
    margin: 0 !important;
    width: 100%;
}

.ai-translator-dropdown ul li {
    display: flex;
    align-items: center;
    width: 100%;
    text-align: left;
    height: 32px;
    padding: 0 10px;
    font-size: 14px;
    cursor: pointer;
    transition: 0.4s ease-in-out;
    transition-property: background, color;
}

.ai-translator-dropdown ul li:nth-child(1) {
    border-radius: 4px 4px 0 0;
}

.ai-translator-dropdown ul li:nth-last-child(1) {
    border-radius: 0 0 4px 4px;
}

.ai-translator-dropdown ul li:hover {
    background: var(--primary, #337ab7);
    color: #fff;
}

.ai-translator-dropdown ul li .ai-translator-flag {
    display: block;
    padding-right: 5px;
}

.ai-translator-dropdown ul li .ai-translator-flag span {
    display: block;
    position: relative;
    width: 16px;
    height: 16px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100% 100%;
}

/** use: https://www.toptal.com/developers/css/sprite-generator */
.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-af {
    background: url('../flags/_sprites.png') -10px -10px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-am {
    background: url('../flags/_sprites.png') -46px -10px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-ar {
    background: url('../flags/_sprites.png') -10px -46px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-az {
    background: url('../flags/_sprites.png') -46px -46px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-be {
    background: url('../flags/_sprites.png') -82px -10px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-bg {
    background: url('../flags/_sprites.png') -82px -46px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-bn {
    background: url('../flags/_sprites.png') -10px -82px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-bs {
    background: url('../flags/_sprites.png') -46px -82px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-ca {
    background: url('../flags/_sprites.png') -82px -82px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-ceb {
    background: url('../flags/_sprites.png') -118px -10px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-co {
    background: url('../flags/_sprites.png') -118px -46px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-cs {
    background: url('../flags/_sprites.png') -118px -82px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-cy {
    background: url('../flags/_sprites.png') -10px -118px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-da {
    background: url('../flags/_sprites.png') -46px -118px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-de {
    background: url('../flags/_sprites.png') -82px -118px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-el {
    background: url('../flags/_sprites.png') -118px -118px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-en {
    background: url('../flags/_sprites.png') -154px -10px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-en_ca {
    background: url('../flags/_sprites.png') -154px -46px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-en_us {
    background: url('../flags/_sprites.png') -154px -82px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-eo {
    background: url('../flags/_sprites.png') -154px -118px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-es {
    background: url('../flags/_sprites.png') -10px -154px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-es_ar {
    background: url('../flags/_sprites.png') -46px -154px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-es_co {
    background: url('../flags/_sprites.png') -82px -154px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-es_mx {
    background: url('../flags/_sprites.png') -118px -154px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-et {
    background: url('../flags/_sprites.png') -154px -154px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-eu {
    background: url('../flags/_sprites.png') -190px -10px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-fi {
    background: url('../flags/_sprites.png') -190px -46px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-fa {
    background: url('../flags/_sprites.png') -190px -82px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-fr {
    background: url('../flags/_sprites.png') -190px -118px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-fr_qc {
    background: url('../flags/_sprites.png') -190px -154px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-fy {
    background: url('../flags/_sprites.png') -10px -190px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-ga {
    background: url('../flags/_sprites.png') -46px -190px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-gd {
    background: url('../flags/_sprites.png') -82px -190px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-gl {
    background: url('../flags/_sprites.png') -118px -190px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-gu {
    background: url('../flags/_sprites.png') -154px -190px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-haw {
    background: url('../flags/_sprites.png') -190px -190px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-ha {
    background: url('../flags/_sprites.png') -226px -10px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-hi {
    background: url('../flags/_sprites.png') -226px -46px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-hmn {
    background: url('../flags/_sprites.png') -226px -82px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-hr {
    background: url('../flags/_sprites.png') -226px -118px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-ht {
    background: url('../flags/_sprites.png') -226px -154px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-hu {
    background: url('../flags/_sprites.png') -226px -190px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-hy {
    background: url('../flags/_sprites.png') -10px -226px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-id {
    background: url('../flags/_sprites.png') -46px -226px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-ig {
    background: url('../flags/_sprites.png') -82px -226px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-is {
    background: url('../flags/_sprites.png') -118px -226px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-it {
    background: url('../flags/_sprites.png') -154px -226px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-iw {
    background: url('../flags/_sprites.png') -190px -226px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-ka {
    background: url('../flags/_sprites.png') -226px -226px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-ja {
    background: url('../flags/_sprites.png') -262px -10px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-jw {
    background: url('../flags/_sprites.png') -262px -46px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-kk {
    background: url('../flags/_sprites.png') -262px -82px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-km {
    background: url('../flags/_sprites.png') -262px -118px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-kn {
    background: url('../flags/_sprites.png') -262px -154px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-ko {
    background: url('../flags/_sprites.png') -262px -190px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-ku {
    background: url('../flags/_sprites.png') -262px -226px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-ky {
    background: url('../flags/_sprites.png') -10px -262px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-la {
    background: url('../flags/_sprites.png') -46px -262px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-lb {
    background: url('../flags/_sprites.png') -82px -262px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-lo {
    background: url('../flags/_sprites.png') -118px -262px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-lt {
    background: url('../flags/_sprites.png') -154px -262px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-lv {
    background: url('../flags/_sprites.png') -190px -262px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-mg {
    background: url('../flags/_sprites.png') -226px -262px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-mi {
    background: url('../flags/_sprites.png') -262px -262px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-mk {
    background: url('../flags/_sprites.png') -298px -10px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-ml {
    background: url('../flags/_sprites.png') -298px -46px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-mn {
    background: url('../flags/_sprites.png') -298px -82px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-mr {
    background: url('../flags/_sprites.png') -298px -118px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-ms {
    background: url('../flags/_sprites.png') -298px -154px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-mt {
    background: url('../flags/_sprites.png') -298px -190px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-my {
    background: url('../flags/_sprites.png') -298px -226px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-ne {
    background: url('../flags/_sprites.png') -298px -262px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-nl {
    background: url('../flags/_sprites.png') -10px -298px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-ny {
    background: url('../flags/_sprites.png') -46px -298px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-no {
    background: url('../flags/_sprites.png') -82px -298px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-pa {
    background: url('../flags/_sprites.png') -118px -298px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-pl {
    background: url('../flags/_sprites.png') -154px -298px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-pt {
    background: url('../flags/_sprites.png') -190px -298px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-ps {
    background: url('../flags/_sprites.png') -226px -298px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-pt_br {
    background: url('../flags/_sprites.png') -262px -298px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-ro {
    background: url('../flags/_sprites.png') -298px -298px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-ru {
    background: url('../flags/_sprites.png') -334px -10px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-sd {
    background: url('../flags/_sprites.png') -334px -46px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-si {
    background: url('../flags/_sprites.png') -334px -82px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-sk {
    background: url('../flags/_sprites.png') -334px -118px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-sl {
    background: url('../flags/_sprites.png') -334px -154px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-sm {
    background: url('../flags/_sprites.png') -334px -190px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-sn {
    background: url('../flags/_sprites.png') -334px -226px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-so {
    background: url('../flags/_sprites.png') -334px -262px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-sq {
    background: url('../flags/_sprites.png') -334px -298px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-sr {
    background: url('../flags/_sprites.png') -10px -334px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-st {
    background: url('../flags/_sprites.png') -46px -334px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-su {
    background: url('../flags/_sprites.png') -82px -334px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-sv {
    background: url('../flags/_sprites.png') -118px -334px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-sw {
    background: url('../flags/_sprites.png') -154px -334px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-ta {
    background: url('../flags/_sprites.png') -190px -334px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-te {
    background: url('../flags/_sprites.png') -226px -334px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-tg {
    background: url('../flags/_sprites.png') -262px -334px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-th {
    background: url('../flags/_sprites.png') -298px -334px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-tl {
    background: url('../flags/_sprites.png') -334px -334px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-tr {
    background: url('../flags/_sprites.png') -370px -10px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-uk {
    background: url('../flags/_sprites.png') -370px -46px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-ur {
    background: url('../flags/_sprites.png') -370px -82px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-uz {
    background: url('../flags/_sprites.png') -370px -118px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-vi {
    background: url('../flags/_sprites.png') -370px -154px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-xh {
    background: url('../flags/_sprites.png') -370px -190px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-yi {
    background: url('../flags/_sprites.png') -370px -226px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-yo {
    background: url('../flags/_sprites.png') -370px -262px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-zh_CN {
    background: url('../flags/_sprites.png') -370px -298px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-zh_TW {
    background: url('../flags/_sprites.png') -370px -334px;
}

.ai-translator-dropdown ul li .ai-translator-flag span.ai-flag-zu {
    background: url('../flags/_sprites.png') -10px -370px;
}

.ai-translator-dropdown ul li .ai-translator-name {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding-right: 10px;
    flex-basis: 100%;
}

.ai-translator-dropdown.with-flag ul li .ai-translator-name {
    padding: 0 10px;
    flex-basis: calc(100% - 24px);
}

.ai-translator-dropdown ul li .ai-translator-check {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    width: 24px;
    height: 24px;
    display: none;
}

.ai-translator-dropdown ul li.active .ai-translator-check {
    display: flex;
}

.ai-translator-dropdown .simplebar-scrollbar {
    width: 4px;
    min-height: 20px;
}