.select-language {
    width: 35px;
    height: 35px;
    padding: 4px;
    border-radius: 40%;
    border: 1px solid #fff;
    position: relative;
}

    .select-language .select-language-container, .select-language ul li div {
        width: 25px;
        height: 25px;
        border-radius: 40%;
        overflow: hidden;
        position: relative;
        display: block;
        cursor: pointer;
    }

        .select-language .select-language-container img, .select-language ul li div img, .select-language .select-language-container img.select-language-img, .select-language ul li div img.select-language-img {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 35px;
            max-width: 35px;
            height: 35px;
            z-index: 101;
        }

    .select-language ul {
        display: block;
        height: auto;
        list-style: none;
        padding: 0;
        margin: 0;
        position: absolute;
        top: 0;
        left: -1px;
        background: rgba(255, 255, 255, 0.5);
        z-index: 100;
        border-radius: 17px;
        transform: scaleY(0);
        box-shadow: 0 2px 8px 1px rgba(35, 47, 53, 0.12);
    }

        .select-language ul li:first-child {
            margin-top: 40px;
        }

        .select-language ul li {
            width: 35px;
            padding-left: 0;
        }
        .select-language ul li a{
            margin: 0;
        }

            .select-language ul li div {
                margin: 5px;
            }

.select_language-open {
    -webkit-animation: scaleOpen 0.2s normal forwards ease-in-out;
    -moz-animation: scaleOpen 0.2s normal forwards ease-in-out;
    -o-animation: scaleOpen 0.2s normal forwards ease-in-out;
    animation: scaleOpen 0.2s normal forwards ease-in-out;
    -webkit-transform-origin: 50% 20px;
    -moz-transform-origin: 50% 20px;
    -o-transform-origin: 50% 20px;
    transform-origin: 50% 20px;
}

.select_language-close {
    -webkit-animation: scaleClose 0.2s normal forwards ease-in-out;
    -moz-animation: scaleClose 0.2s normal forwards ease-in-out;
    -o-animation: scaleClose 0.2s normal forwards ease-in-out;
    animation: scaleClose 0.2s normal forwards ease-in-out;
    -webkit-transform-origin: 50% 20px;
    -moz-transform-origin: 50% 20px;
    -o-transform-origin: 50% 20px;
    transform-origin: 50% 20px;
}

@-webkit-keyframes scaleOpen {
    from {
        transform: scaleY(0);
    }

    to {
        transform: scaleY(1);
    }
}

@-moz-keyframes scaleOpen {
    from {
        transform: scaleY(0);
    }

    to {
        transform: scaleY(1);
    }
}

@-o-keyframes scaleOpen {
    from {
        transform: scaleY(0);
    }

    to {
        transform: scaleY(1);
    }
}

@keyframes scaleOpen {
    from {
        transform: scaleY(0);
    }

    to {
        transform: scaleY(1);
    }
}

@-webkit-keyframes scaleClose {
    from {
        transform: scaleY(1);
    }

    to {
        transform: scaleY(0);
    }
}

@-moz-keyframes scaleClose {
    from {
        transform: scaleY(1);
    }

    to {
        transform: scaleY(0);
    }
}

@-o-keyframes scaleClose {
    from {
        transform: scaleY(1);
    }

    to {
        transform: scaleY(0);
    }
}

@keyframes scaleClose {
    from {
        transform: scaleY(1);
    }

    to {
        transform: scaleY(0);
    }
}