@import url(//fonts.googleapis.com/css?family=Comfortaa:400,700&subset=latin,cyrillic-ext,greek,latin-ext,cyrillic);

.letter, .selected-chars, .word-answer {
    text-transform: uppercase;
}

html {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    height: 100%;
}

.adsbygoogle {
    margin: 0 auto;
}

.invisible {
    visibility: hidden;
}

.float-right {
    float: right;
}

.float-left {
    float: left;
}


@media(max-width:542px),(max-height:700px) {
    .main-layout:not(.no-zoom), .copyright:not(.no-zoom), .ads-bottom:not(.no-zoom), .sharing-buttons:not(.no-zoom) {
        zoom: 85%;
    }

    .sharing-buttons:not(.no-zoom)>div{
        zoom:120.8537%;
    }

    .sharing-buttons:not(.no-zoom)>div > div.fb-share-button, .sharing-buttons:not(.no-zoom)>div > div.gp-like{
        top:0;
    }

    .ads-bottom:not(.no-zoom) {
        height: auto;
    }

        .ads-bottom:not(.no-zoom) #div-gpt, .ads-bottom:not(.no-zoom) .adsbygoogle {
            zoom: 120.8537%;
        }

    body.pro .copyright:not(.no-zoom) {
        height: 59px;
        padding: 16px 0 4px;
    }
}

*, *:before, *:after {
    -webkit-box-sizing: inherit;
    -moz-box-sizing: inherit;
    box-sizing: inherit;
}

body {
    margin: 0;
    font-size: 9px;
    line-height: 1.428571429;
    height: calc(100% - 63px);
}

    body.pro {
        height: calc(100% - 59px);
    }

img {
    vertical-align: middle;
    border: 0;
}

.cursor-default {
    cursor: default;
}

.game-menu > .store-banner-line {
    padding: 14px 14px 14px 14px;
    overflow: hidden;
    position: fixed;
    bottom: 0;
    right: 0;
    left: 0;
    z-index: 10;
    background-color: #ffffff;
    border-left: 1px solid #c4c8c7;
    border-bottom: 1px solid #c4c8c7;
}

.store-banner-line > div.title {
    font-size: 24pt;
    display: block;
    font-family: Comfortaa;
    margin-bottom: 14px;
}

.store-banner-line > div.tx {
    font-size: 14pt;
    display: block;
    font-family: Comfortaa;
    margin-bottom: 22px;
}

        .game-menu > .store-banner-line > span, .game-menu > .store-banner-line > a {
        font-family: Helvetica;
        font-size: 26pt;
        color: #808d8e;
    }

    .game-menu > .store-banner-line > .close {
        cursor: pointer;
        margin-right: 7px;
        position: absolute;
        right: 5px;
        top: 0;
    }

.global-messages input[type=text] {
    font-size: 17px;
    margin-top: 10px;
    width: 360px;
}

.copyright {
    height: 50px;
    text-align: center;
    font-size: 15px;
    padding: 4px 0 4px;
}

    .copyright > a.store-icon {
        display: inline-block;
        min-height: 15px;
        background-position: 0 4px;
        background-repeat: no-repeat;
        text-decoration: none;
    }

        .copyright > a.store-icon.itunes {
            background-image: url(../img/itunes-66x15.png);
            width: 66px;
        }

        .copyright > a.store-icon.google-play {
            background-image: url(../img/google-play-70x15.png);
            width: 70px;
        }

        .copyright > a.store-icon.windows-phone {
            background-image: url(../img/windows-phone-105x15.png);
            width: 105px;
        }

.ads-bottom {
    text-align: center;
    height: 93px;
    position: relative;
}

    .ads-bottom:before {
        position: absolute;
        font-family: serif;
        font-style: italic;
        color: #808D8E;
        content: "Advertisement";
        top: -12px;
        font-size: 11px;
        width: 100%;
        left: 0;
    }

body.pro > .ads-bottom {
    display: none;
}

.global-messages.overlay {
    z-index: 6;
    overflow: auto;
}

div.game-menu {
    margin-top: 84px;
    height: calc(100% - 84px);
    overflow: auto;
    position: relative;
}

.game-menu:not(.animation-enabled) > .menu-view.hidden, .main-layout.no-zoom > .game-menu > .menu-view.hidden {
    display: none;
}

.main-layout:not(.no-zoom) > div.game-menu.animation-enabled {
    overflow-x: hidden;
}

.main-layout:not(.no-zoom) > .game-menu.animation-enabled > .menu-view {
    z-index: 1;
    position: absolute;
    width: 100%;
    left: 0;
    opacity: 1;
    transition: opacity 0.2s ease, left 0.2s ease, height 0.2s ease;
}


    .main-layout:not(.no-zoom) > .game-menu.animation-enabled > .menu-view.store {
        padding-left: calc(50% - 231px);
        padding-right: calc(50% - 231px);
    }

    .main-layout:not(.no-zoom) > .game-menu.animation-enabled > .menu-view.hidden {
        z-index: -1000;
        left: 100%;
        opacity: 0;
        transition: opacity 0.2s ease, left 0.2s ease;
        width: 0;
        overflow: hidden;
        padding:0;
    }

@media(min-width:764px) and (max-height:675px) {
    .main-layout:not(.no-zoom) > .game-menu.animation-enabled > .menu-view {
        left: calc(50% - 382px);
        right: calc(50% - 382px);
        width: 764px;
    }

        .main-layout:not(.no-zoom) > .game-menu.animation-enabled > .menu-view.store {
            width: 401px;
            left: calc(50% - 231px);
            right: calc(50% - 231px);
            padding:0;
        }

        .main-layout:not(.no-zoom) > .game-menu.animation-enabled > .menu-view.hidden {
            right: auto;
        }
}


div.game-menu > div.header {
    background-color: #f5f6f6;
    background-color: rgba(245, 246, 246, 0.56);
    border-bottom: 1px solid #c4c8c7;
    padding: 14px 0;
    height: 61px;
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 4;
    white-space: nowrap;
}

.button.refresh {
    background: url(../img/refresh.png?r=2) no-repeat -4px -4px;
    width: 36px;
    height: 36px;
    padding: 0;
    display: inline-block;
    cursor: pointer;
}

div.game-menu > div.header > .back {
    background: url(../img/back.png?r=2) no-repeat;
    margin-left: 34px;
}

div.game-menu > div.header > .home {
    background: url(../img/house.png?r=2) no-repeat;
    margin-left: 9px;
}

div.game-menu > div.header > .back, div.game-menu > div.header > .home {
    background-position: -4px -4px;
    display: inline-block;
    width: 34px;
    height: 34px;
    cursor: pointer;
}

div.game-menu > div.header > .settings {
    display: inline-block;
    width: 34px;
    height: 34px;
    margin-right: 34px;
    float: right;
    position: relative;
}

    div.game-menu > div.header > .settings > .btn {
        width: 34px;
        height: 34px;
        background: url(../img/settings.png?r=2) no-repeat;
        background-position: -4px -4px;
        cursor: pointer;
    }

.gray-shadow {
    -webkit-box-shadow: 0 0 6px #aaaaaa;
    -moz-box-shadow: 0 0 6px #aaaaaa;
    -ms-box-shadow: 0 0 6px #aaaaaa;
    -o-box-shadow: 0 0 6px #aaaaaa;
    box-shadow: 0 0 6px #aaaaaa;
    -webkit-box-shadow: 0 0 6px rgba(80, 80, 80, 0.7);
    -moz-box-shadow: 0 0 6px rgba(80, 80, 80, 0.7);
    -ms-box-shadow: 0 0 6px rgba(80, 80, 80, 0.7);
    -o-box-shadow: 0 0 6px rgba(80, 80, 80, 0.7);
    box-shadow: 0 0 6px rgba(80, 80, 80, 0.7);
}

.gray-border{
    -webkit-box-shadow: 0 0 1px #aaaaaa;
    -moz-box-shadow: 0 0 1px #aaaaaa;
    -ms-box-shadow: 0 0 1px #aaaaaa;
    -o-box-shadow: 0 0 1px #aaaaaa;
    box-shadow: 0 0 1px #aaaaaa;
    -webkit-box-shadow: 0 0 1px rgba(80, 80, 80, 0.7);
    -moz-box-shadow: 0 0 1px rgba(80, 80, 80, 0.7);
    -ms-box-shadow: 0 0 1px rgba(80, 80, 80, 0.7);
    -o-box-shadow: 0 0 1px rgba(80, 80, 80, 0.7);
    box-shadow: 0 0 1px rgba(80, 80, 80, 0.7);
}

.flyout {
    position: absolute;
    width: 304px;
    right: 0;
    top: 47px;
    display: none;
    z-index: 1;
}

    .flyout > .listview > div > .subheader {
        overflow: hidden;
    }

    .flyout.visible {
        display: block;
    }

.check-box {
    border: 3px solid;
    width: 65px;
    height: 40px;
    -ms-border-radius: 21px;
    -moz-border-radius: 21px;
    -webkit-border-radius: 21px;
    border-radius: 21px;
}

    .check-box::before {
        content: " ";
        width: 35px;
        height: 35px;
        float: left;
        -ms-border-radius: 18px;
        -moz-border-radius: 18px;
        -webkit-border-radius: 18px;
        border-radius: 18px;
    }

    .check-box.selected {
    }

        .check-box.selected::before {
            float: right;
        }

    .check-box.white-green {
        border-color: #e6e6e6;
        background-color: #f1f1f1;
    }

        .check-box.white-green::before {
            background-color: white;
        }

        .check-box.white-green.selected {
            border-color: #4cd864;
            background-color: #4cd864;
        }

    .check-box.white-blue {
        border-color: #e6e6e6;
        background-color: #f1f1f1;
    }

        .check-box.white-blue::before {
            background-color: white;
        }

        .check-box.white-blue.selected {
            border-color: #3498db;
            background-color: #3498db;
        }

.listview > div > .check-box {
    float: right;
    margin: 7px 20px;
}

.settings > .flyout > .listview {
    border: none;
}

    .settings > .flyout > .listview.lang {
        position: absolute;
        width: 100%;
        top: 174px;
        left: 0;
        border-left: 1px solid #e5e7e9;
        z-index: 6;
        white-space: nowrap;
        height: 0;
        overflow-y: hidden;
        opacity: 0;
        transition: all 0.3s linear;
    }

        .settings > .flyout > .listview.lang > div {
        }

            .settings > .flyout > .listview.lang > div > .subheader, .settings > .flyout > .listview.lang > div > .header {
                margin-right: 27px;
                text-transform: capitalize;
            }

    .settings > .flyout > .listview > .spacer {
        background: white;
        height: 21px;
    }

    .settings > .flyout > .listview > div:not(.spacer) {
        background-color: white;
        background-color: rgba(255, 255, 255, 0.95);
    }

    .settings > .flyout > .listview > div > .header, .settings > .flyout > .listview > div > .subheader {
        margin-left: 27px;
    }

div.game-menu > div.header > .settings:focus {
    outline: 0;
}

div.game-menu > div.header > .navbar-logo {
    width: 229px;
    height: 34px;
    margin: 0 auto;
    display: block;
    cursor: pointer;
}

div.game-menu > div.header > .store-title {
    width: 270px;
    background: url(../img/store-title.png?r=2) no-repeat;
    height: 27px;
    margin: 0 auto;
    display: block;
}

div.game-menu > div.header > .achievements, div.game-menu > div.header > .ranking, div.game-menu > div.header > .statistics, div.game-menu > div.header > .completed-games {
    margin: 0 auto;
    display: block;
    font-size: 28px;
    line-height: 31px;
}

.game-menu > .header > .coins-balance {
    font-size: 20px;
    color: #efa92e;
    margin: 5px 20px;
}

.game-menu > .header > .coins-balance > .popup {
    right: 29px;
    left: auto;
    top: 69px;
}

    .game-menu > .header > .coins-balance > .popup::before {
        right: 79px;
        left: auto;
    }
    .game-menu > .header > .coins-balance.clickable, .game-menu > .header > .coins-balance.clickable > label {
        cursor: pointer;
    }

    .game-menu > .header > .coins-balance > img.coin {
        width: 34px;
        height: 34px;
        margin-right: 5px;
    }

    .game-menu > .header > .coins-balance > span {
        color: #34495e;
    }

.game-menu > .header > .statistics.won {
    color: #27ae60;
}

.game-menu > .header > .statistics.draw {
    color: #e67e22;
}

.game-menu > .header > .statistics.lost {
    color: #e74c3c;
}

div.game-menu > div.header > .achievements, div.game-menu > div.header > .ranking, div.game-menu > div.header > .completed-games {
    color: #f39c12;
}

div.game-menu > div.header > .statistics {
    color: #2c3e50;
}

.overlay-absolute, .overlay, .settings > .flyout > .listview > div.overlay-absolute {
    height: 100%;
    bottom: 0;
    left: 0;
    right: 0;
    top: 0;
    background-color: #ffffff;
    background-color: rgba(255, 255, 255, .4);
    z-index: 5;
}

.overlay-absolute, .listview > div.overlay-absolute {
    position: absolute;
}

.overlay {
    position: fixed;
}

    .overlay > .loading {
        margin: 0 auto;
        position: relative;
        top: 200px;
        font-size: 16px;
        -ms-border-radius: 27px;
        -moz-border-radius: 27px;
        -webkit-border-radius: 27px;
        border-radius: 27px;
    }

        .overlay > .loading.wide .button {
            padding: 3px 30px;
        }

        .overlay > .loading.square {
            width: 135px;
            height: 135px;
        }

        .overlay > .loading.wide {
            width: calc(100% - 27px);
            max-width: 464px;
            -moz-min-width: 383px;
            -ms-min-width: 383px;
            -o-min-width: 383px;
            -webkit-min-width: 383px;
            min-width: 383px;
            padding: 14px;
        }

        .overlay > .loading.wider, .overlay > .loading.widest {
            top: 61px;
            margin-bottom: 41px;
            width: calc(100% - 60px);
            overflow: auto;
            -moz-min-width: 383px;
            -ms-min-width: 383px;
            -o-min-width: 383px;
            -webkit-min-width: 383px;
            min-width: 383px;
            padding: 14px 0;
        }

        .overlay > .loading.widest {
            height: calc(100% - 102px);
        }

        .overlay > .loading.wider {
            max-width: 500px;
            max-height: 600px;
            overflow: visible;
            margin-top: 50px;
        }

        .overlay > .loading.widest.not-full-screen {
            height: auto;
        }

        .overlay > .loading.widest > .credits {
            overflow: auto;
            min-height: 100px;
            padding: 0 28px;
        }

        .overlay > .loading.widest > .hyperlink, .overlay > .loading.wider > .hyperlink, .overlay > .word-lookup > .hyperlink, .game-menu > .word-definition > .hyperlink {
            position: absolute;
            top: 0px;
            right: 20px;
            font-size: 32px;
            margin: 0;
        }

            .overlay > .loading.widest > .hyperlink:hover, .overlay > .loading.wider > .hyperlink:hover, .overlay > .word-lookup > .hyperlink:hover, .game-menu > .word-definition > .hyperlink:hover {
                text-decoration: none;
            }

        .overlay > .loading.wide > .title {
            font-size: 18px;
            color: #00b0ed;
            display: block;
        }

        .overlay > .loading.wide > div, .overlay > .loading.widest > div:not(:first-child) {
            margin-top: 14px;
        }

        .overlay > .loading.dark {
            background-color: #333333;
            color: white;
        }

        .overlay > .loading.light > .spacer {
            height: 1px;
            width: 100%;
            background: #ccc;
            margin-bottom: 9px;
        }

        .overlay > .loading.light > div > .button {
            margin-bottom: 5px;
        }

        .overlay > .loading.light {
            color: #333333;
            background-color: white;
        }

        .overlay > .loading > .centered {
            margin: 9px;
            position: relative;
            top: 50%;
            -webkit-transform: translateY(-50%);
            -moz-transform: translateY(-50%);
            -ms-transform: translateY(-50%);
            -o-transform: translateY(-50%);
            transform: translateY(-50%);
        }

div.main-layout, div.profile-info-navbar, div.game-menu > div.header, .game-menu > .credits {
    -moz-min-width: 489px;
    -ms-min-width: 489px;
    -o-min-width: 489px;
    -webkit-min-width: 489px;
    min-width: 489px;
}

@media(max-width:499px) {
    .main-layout:not(.no-zoom) > div.game-menu > div.header {
        zoom: 0.9;
        -moz-min-width: 523px;
        -ms-min-width: 523px;
        -o-min-width: 523px;
        -webkit-min-width: 523px;
        min-width: 523px;
    }

        .main-layout:not(.no-zoom) > div.game-menu > div.header > .settings > div.flyout {
            zoom: 1.1111;
        }
}


@media(max-width:440px) {
    .main-layout:not(.no-zoom) > div.game-menu > div.header {
        zoom: 0.8;
        -moz-min-width: 611px;
        -ms-min-width: 611px;
        -o-min-width: 611px;
        -webkit-min-width: 611px;
        min-width: 611px;
    }

        .main-layout:not(.no-zoom) > div.game-menu > div.header > .settings > div.flyout {
            zoom: 1.25;
        }
}

.game-menu > .main-menu > .subheader, .game-menu > .credits {
    max-width: 764px;
}

div.main-layout {
    text-align: center;
    width: 100%;
    margin: 0 auto;
    height: calc(100% - 80px);
    overflow: auto;
    overflow-x: hidden;
}

@media(min-width:764px) and (min-height:676px) {
    div.main-layout {
        padding-left: calc(50% - 382px);
        padding-right: calc(50% - 382px);
    }
}

@media(min-width:764px) and (max-height:675px) {
    div.game-menu {
        padding-left: calc(50% - 382px);
        padding-right: calc(50% - 382px);
    }

    div.game {
        padding-left: calc(50% - 449px);
        padding-right: calc(50% - 449px);
    }
}

body.pro > div.main-layout {
    height: 100%;
}

div.game {
    width: calc(100% - 73px);
    margin: 0 auto;
    height: calc(100% - 84px);
}

    div.game.tutorial {
        overflow: auto;
        height: calc(100% - 298px);
    }

    div.game > .overlay {
        z-index: 6;
    }

div.wordwheel, .wordwheel > .container, .wordwheel > canvas.round-timer {
    width: 315px;
    height: 315px;
}

div.wordwheel {
    clear: both;
    background: url(../img/wordwheel.png?r=2) no-repeat;
    margin: 0 auto;
    position: relative;
}

    div.wordwheel > .selected-chars {
        display: none;
    }

div.score-sum {
    position: absolute;
    top: 0;
    right: 10px;
    white-space: nowrap;
    text-align: right;
}

@media(min-width:600px) and (max-height:675px) {
    .game:not(.tutorial):not(.no-album) > .gameplay > div.wordwheel {
        float: left;
        margin-top: 14px;
        margin-left: 20px;
    }

        .game:not(.tutorial):not(.no-album) > .gameplay > div.wordwheel > .selected-chars {
            display: block;
        }

    .game:not(.tutorial):not(.no-album) > .gameplay > .found-words {
        margin-left: 321px;
    }

    .game:not(.tutorial):not(.no-album) > .gameplay > .selected-chars {
        display: none;
    }

    .game:not(.tutorial):not(.no-album) > .gameplay > .header > div.score-sum {
        left: 50px;
        text-align: right;
        right: auto;
        width: 270px;
        top: -10px;
    }

    .game:not(.tutorial):not(.no-album) > .gameplay > div > div.word-answer {
        width: 130px;
    }

    .game:not(.tutorial):not(.no-album) > .gameplay > .button.hint {
        left: -12px;
        top: 14px;
    }

    .game:not(.tutorial):not(.no-album) > .gameplay > .floating-message {
        top: 0;
        left: -35px;
    }

    .game:not(.tutorial):not(.no-album) > .gameplay > .header {
        height: 53px;
    }

        .game:not(.tutorial):not(.no-album) > .gameplay > .header > span.time-left {
            position: absolute;
            top: 12px;
            left: 137px;
        }
}

@media(min-width:764px) and (max-height:675px) {
    div.game-menu {
        padding-left: calc(50% - 382px);
        padding-right: calc(50% - 382px);
    }
}

.wordwheel > .container {
    overflow: hidden;
}

.no-display {
    display: none;
}

.points-bubble {
    position: absolute;
    text-align: center;
    top: 0;
    left: 0;
    -ms-border-radius: 100px;
    -moz-border-radius: 100px;
    -webkit-border-radius: 100px;
    border-radius: 100px;
    border: 27px solid white;
    cursor: default;
    display: block;
    -webkit-animation: zoom-in-bubble 2s 1 normal linear;
    -moz-animation: zoom-in-bubble 2s 1 normal linear;
    -ms-animation: zoom-in-bubble 2s 1 normal linear;
    -o-animation: zoom-in-bubble 2s 1 normal linear;
    animation: zoom-in-bubble 2s 1 normal linear;
    -webkit-transform: rotate(-390deg) translateY(350px) rotate(390deg);
    -moz-transform: rotate(-390deg) translateY(350px) rotate(390deg);
    -ms-transform: rotate(-390deg) translateY(350px) rotate(390deg);
    -o-transform: rotate(-390deg) translateY(350px) rotate(390deg);
    transform: rotate(-390deg) translateY(350px) rotate(390deg);
    -webkit-animation-fill-mode: forwards; /*Chrome 16+, Safari 4+*/
    -moz-animation-fill-mode: forwards; /*FF 5+*/
    -o-animation-fill-mode: forwards; /*Not implemented yet*/
    -ms-animation-fill-mode: forwards; /*IE 10+*/
    animation-fill-mode: forwards; /*when the spec is finished*/
    opacity: 0;
    z-index: 5;
    background-color: white;
}

    .points-bubble.l-0 {
        width: 57.5px;
        height: 57.5px;
        border-width: 5px;
        font-size: 44px;
        line-height: 58px;
        color: #05d750;
        border-color: #05d750;
    }

    .points-bubble.l-1 {
        width: 75px;
        height: 75px;
        border-width: 7px;
        font-size: 58px;
        line-height: 77px;
        color: #3498db;
        border-color: #3498db;
    }

    .points-bubble.l-2 {
        width: 90px;
        height: 90px;
        border-width: 9px;
        font-size: 70px;
        line-height: 90px;
        color: #ff4917;
        border-color: #ff4917;
    }

    .points-bubble.l-3 {
        width: 135px;
        height: 135px;
        border-width: 13px;
        font-size: 100px;
        line-height: 134px;
        color: #ed145b;
        border-color: #ed145b;
    }

@keyframes zoom-in-bubble {
    0% {
        opacity: 0.5;
        width: 23px;
        height: 23px;
        border-width: 0;
        top: -150px;
        left: 108px;
        font-size: 5px;
        line-height: 28px;
        transform: rotate(-270deg) translate(450px) rotate(270deg);
    }

    80% {
        opacity: 0.7;
    }

    100% {
        opacity: 0;
        transform: rotate(-390deg) translate(250px) rotate(390deg);
        width: 120px;
        height: 120px;
        border-width: 9px;
        font-size: 70px;
        line-height: 90px;
    }
}

@-webkit-keyframes zoom-in-bubble {
    0% {
        opacity: 0.5;
        width: 23px;
        height: 23px;
        border-width: 0;
        top: -150px;
        left: 108px;
        font-size: 5px;
        line-height: 28px;
        -webkit-transform: rotate(-270deg) translate(450px) rotate(270deg);
    }

    80% {
        opacity: 0.7;
    }

    100% {
        opacity: 0;
        -webkit-transform: rotate(-390deg) translate(250px) rotate(390deg);
        width: 120px;
        height: 120px;
        border-width: 9px;
        font-size: 70px;
        line-height: 90px;
    }
}

@-moz-keyframes zoom-in-bubble {
    0% {
        opacity: 0.5;
        width: 23px;
        height: 23px;
        border-width: 0;
        top: -150px;
        left: 108px;
        font-size: 5px;
        line-height: 28px;
        -moz-transform: rotate(-270deg) translate(450px) rotate(270deg);
    }

    80% {
        opacity: 0.7;
    }

    100% {
        opacity: 0;
        -moz-transform: rotate(-390deg) translate(250px) rotate(390deg);
    }
}

@-ms-keyframes zoom-in-bubble {
    0% {
        opacity: 0.5;
        width: 23px;
        height: 23px;
        border-width: 0;
        top: -150px;
        left: 108px;
        font-size: 5px;
        line-height: 28px;
        -ms-transform: rotate(-270deg) translate(450px) rotate(270deg);
    }

    80% {
        opacity: 0.7;
    }

    100% {
        opacity: 0;
        -ms-transform: rotate(-390deg) translate(250px) rotate(390deg);
        width: 95px;
        height: 95px;
        border-width: 9px;
        font-size: 70px;
        line-height: 90px;
    }
}

@-o-keyframes zoom-in-bubble {
    0% {
        opacity: 0.5;
        width: 23px;
        height: 23px;
        border-width: 0;
        top: -150px;
        left: 108px;
        font-size: 5px;
        line-height: 28px;
        -o-transform: rotate(-270deg) translate(450px) rotate(270deg);
    }

    80% {
        opacity: 0.7;
    }

    100% {
        opacity: 0;
        -o-transform: rotate(-390deg) translate(250px) rotate(390deg);
    }
}

.wordwheel > canvas.round-timer {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
}

div.letter-tutorial-overlay {
    position: absolute;
    background: white;
    z-index: 3;
    opacity: 0.5;
}

.wordwheel > .tutorial-overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    background: white;
    top: 0;
    left: 0;
    opacity: 0.5;
    -ms-border-radius: 200px;
    -moz-border-radius: 200px;
    -webkit-border-radius: 200px;
    border-radius: 200px;
}

div.letter {
    text-align: center;
    color: white;
    border-width: 3px;
    border-style: solid;
    cursor: pointer;
    z-index: 3;
    /*text-transform: uppercase;*/
}

div.letter, div.letter-tutorial-overlay {
    width: 81px;
    height: 81px;
    line-height: 81px;
    -ms-border-radius: 40px;
    -moz-border-radius: 40px;
    -webkit-border-radius: 40px;
    border-radius: 40px;
}

    div.letter span {
        line-height: 74px;
        font-size: 61px;
    }


@media only screen and (max-resolution : 96dpi) {
    div.wordwheel, .wordwheel > .container, .wordwheel > canvas.round-timer {
        width: 270px;
        height: 270px;
    }

    div.wordwheel {
        background: url(../img/wordwheel.300x300.png?r=2) no-repeat;
    }

    div.letter, div.letter-tutorial-overlay {
        width: 72px;
        height: 72px;
        line-height: 72px;
        -ms-border-radius: 36px;
        -moz-border-radius: 36px;
        -webkit-border-radius: 36px;
        border-radius: 36px;
    }

        div.letter span {
            line-height: 65px;
            font-size: 55px;
        }
}


div.letter.letter-0 {
    background-color: #2c3e50;
    border-color: #2c3e50;
}

div.letter.letter-1 {
    background-color: #ed145b;
    border-color: #ed145b;
}

div.letter.letter-2 {
    background-color: #3498db;
    border-color: #3498db;
}

div.letter.letter-3 {
    background-color: #f39c12;
    border-color: #f39c12;
}

div.letter.letter-4 {
    background-color: #1abc9c;
    border-color: #1abc9c;
}

div.letter.letter-5 {
    background-color: #9b59b6;
    border-color: #9b59b6;
}

div.letter.letter-6 {
    background-color: #c0392b;
    border-color: #c0392b;
}

div.letter.letter-7 {
    background-color: #f1c40f;
    border-color: #f1c40f;
}

div.letter.letter-8 {
    background-color: #1abc9c;
    border-color: #1abc9c;
}

div.letter.letter-0.selected {
    color: #2c3e50;
}

div.letter.letter-1.selected {
    color: #ed145b;
}

div.letter.letter-2.selected {
    color: #3498db;
}

div.letter.letter-3.selected {
    color: #f39c12;
}

div.letter.letter-4.selected {
    color: #1abc9c;
}

div.letter.letter-5.selected {
    color: #9b59b6;
}

div.letter.letter-6.selected {
    color: #c0392b;
}

div.letter.letter-7.selected {
    color: #f1c40f;
}

div.letter.letter-8.selected {
    color: #1abc9c;
}

div.letter.selected {
    background: white;
}

div.letter.highlighted {
    -webkit-animation: shaking-letter 0.1s 3 normal linear;
    -moz-animation: shaking-letter 0.1s 3 normal linear;
    -ms-animation: shaking-letter 0.1s 3 normal linear;
    -o-animation: shaking-letter 0.1s 3 normal linear;
    animation: shaking-letter 0.1s 3 normal linear;
}

div.letter-0.blinking {
    -webkit-animation: blinking-letter-0 2s infinite normal ease;
    -moz-animation: blinking-letter-0 2s infinite normal ease;
    -ms-animation: blinking-letter-0 2s infinite normal ease;
    -o-animation: blinking-letter-0 2s infinite normal ease;
    animation: blinking-letter-0 2s infinite normal ease;
}

div.letter-1.blinking {
    -webkit-animation: blinking-letter-1 2s infinite normal ease;
    -moz-animation: blinking-letter-1 2s infinite normal ease;
    -ms-animation: blinking-letter-1 2s infinite normal ease;
    -o-animation: blinking-letter-1 2s infinite normal ease;
    animation: blinking-letter-1 2s infinite normal ease;
}

div.letter-2.blinking {
    -webkit-animation: blinking-letter-2 2s infinite normal ease;
    -moz-animation: blinking-letter-2 2s infinite normal ease;
    -ms-animation: blinking-letter-2 2s infinite normal ease;
    -o-animation: blinking-letter-2 2s infinite normal ease;
    animation: blinking-letter-2 2s infinite normal ease;
}

div.letter-3.blinking {
    -webkit-animation: blinking-letter-3 2s infinite normal ease;
    -moz-animation: blinking-letter-3 2s infinite normal ease;
    -ms-animation: blinking-letter-3 2s infinite normal ease;
    -o-animation: blinking-letter-3 2s infinite normal ease;
    animation: blinking-letter-3 2s infinite normal ease;
}

div.letter-4.blinking {
    -webkit-animation: blinking-letter-4 2s infinite normal ease;
    -moz-animation: blinking-letter-4 2s infinite normal ease;
    -ms-animation: blinking-letter-4 2s infinite normal ease;
    -o-animation: blinking-letter-4 2s infinite normal ease;
    animation: blinking-letter-4 2s infinite normal ease;
}

div.letter-5.blinking {
    -webkit-animation: blinking-letter-5 2s infinite normal ease;
    -moz-animation: blinking-letter-5 2s infinite normal ease;
    -ms-animation: blinking-letter-5 2s infinite normal ease;
    -o-animation: blinking-letter-5 2s infinite normal ease;
    animation: blinking-letter-5 2s infinite normal ease;
}

div.letter-6.blinking {
    -webkit-animation: blinking-letter-6 2s infinite normal ease;
    -moz-animation: blinking-letter-6 2s infinite normal ease;
    -ms-animation: blinking-letter-6 2s infinite normal ease;
    -o-animation: blinking-letter-6 2s infinite normal ease;
    animation: blinking-letter-6 2s infinite normal ease;
}

.hand {
    width: 100px;
    height: 63px;
    position: absolute;
    background: url(../img/hand.png) no-repeat;
    z-index: 3;
    -webkit-animation: blinking-hand 2s infinite normal ease;
    -moz-animation: blinking-hand 2s infinite normal ease;
    -ms-animation: blinking-hand 2s infinite normal ease;
    -o-animation: blinking-hand 2s infinite normal ease;
    animation: blinking-hand 2s infinite normal ease;
    opacity: 0.9;
}

.no-hand-animation .hand {
    -webkit-animation: none;
    -moz-animation: none;
    -ms-animation: none;
    -o-animation: none;
    animation: none;
}

.no-hand-animation div.letter.blinking {
    -webkit-animation: none;
    -moz-animation: none;
    -ms-animation: none;
    -o-animation: none;
    animation: none;
}

.hand > .description {
    font-size: 18px;
    display: block;
    right: 0px;
    bottom: 70px;
    width: 120px;
    position: absolute;
    text-shadow: -1px -1px 0 white, -1px 1px 0 white, 1px -1px 0 white, 1px 1px 0 white;
}

@-webkit-keyframes tilting-letter {
    0% {
        -webkit-transform: rotate(0deg);
    }

    25% {
        -webkit-transform: rotate(7deg);
    }

    50% {
        -webkit-transform: rotate(0deg);
    }

    75% {
        -webkit-transform: rotate(-7deg);
    }

    100% {
        -webkit-transform: rotate(0deg);
    }
}

@-moz-keyframes tilting-letter {
    0% {
        -moz-transform: rotate(0deg);
    }

    25% {
        -moz-transform: rotate(7deg);
    }

    50% {
        -moz-transform: rotate(0deg);
    }

    75% {
        -moz-transform: rotate(-7deg);
    }

    100% {
        -moz-transform: rotate(0deg);
    }
}

@-ms-keyframes tilting-letter {
    0% {
        -ms-transform: rotate(0deg);
    }

    25% {
        -ms-transform: rotate(7deg);
    }

    50% {
        -ms-transform: rotate(0deg);
    }

    75% {
        -ms-transform: rotate(-7deg);
    }

    100% {
        -ms-transform: rotate(0deg);
    }
}

@-o-keyframes tilting-letter {
    0% {
        -o-transform: rotate(0deg);
    }

    25% {
        -o-transform: rotate(7deg);
    }

    50% {
        -o-transform: rotate(0deg);
    }

    75% {
        -o-transform: rotate(-7deg);
    }

    100% {
        -o-transform: rotate(0deg);
    }
}

@keyframes tilting-letter {
    0% {
        transform: rotate(0deg);
    }

    25% {
        transform: rotate(7deg);
    }

    50% {
        transform: rotate(0deg);
    }

    75% {
        transform: rotate(-7deg);
    }

    100% {
        transform: rotate(0deg);
    }
}

@-webkit-keyframes shaking-letter {
    0% {
        margin-left: -10px;
    }

    25% {
        margin-left: 0px;
    }

    50% {
        margin-left: 10px;
    }

    75% {
        margin-left: 0;
    }

    100% {
        margin-left: -10px;
    }
}

@-moz-keyframes shaking-letter {
    0% {
        margin-left: -10px;
    }

    25% {
        margin-left: 0px;
    }

    50% {
        margin-left: 10px;
    }

    75% {
        margin-left: 0;
    }

    100% {
        margin-left: -10px;
    }
}

@-ms-keyframes shaking-letter {
    0% {
        margin-left: -10px;
    }

    25% {
        margin-left: 0px;
    }

    50% {
        margin-left: 10px;
    }

    75% {
        margin-left: 0;
    }

    100% {
        margin-left: -10px;
    }
}

@-o-keyframes shaking-letter {
    0% {
        margin-left: -10px;
    }

    25% {
        margin-left: 0px;
    }

    50% {
        margin-left: 10px;
    }

    75% {
        margin-left: 0;
    }

    100% {
        margin-left: -10px;
    }
}

@keyframes shaking-letter {
    0% {
        margin-left: -10px;
    }

    25% {
        margin-left: 0px;
    }

    50% {
        margin-left: 10px;
    }

    75% {
        margin-left: 0;
    }

    100% {
        margin-left: -10px;
    }
}

@-webkit-keyframes blinking-letter-0 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #3a79b9;
        box-shadow: 0 0 16px #3a79b9;
    }

    100% {
        opacity: 1;
    }
}

@-moz-keyframes blinking-letter-0 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #3a79b9;
        box-shadow: 0 0 16px #3a79b9;
    }

    100% {
        opacity: 1;
    }
}

@-ms-keyframes blinking-letter-0 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #3a79b9;
        box-shadow: 0 0 16px #3a79b9;
    }

    100% {
        opacity: 1;
    }
}

@-o-keyframes blinking-letter-0 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #3a79b9;
        box-shadow: 0 0 16px #3a79b9;
    }

    100% {
        opacity: 1;
    }
}

@keyframes blinking-letter-0 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #3a79b9;
        box-shadow: 0 0 16px #3a79b9;
    }

    100% {
        opacity: 1;
    }
}

@-webkit-keyframes blinking-letter-1 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #fc5d91;
        box-shadow: 0 0 16px #fc5d91;
    }

    100% {
        opacity: 1;
    }
}

@-moz-keyframes blinking-letter-1 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #fc5d91;
        box-shadow: 0 0 16px #fc5d91;
    }

    100% {
        opacity: 1;
    }
}

@-ms-keyframes blinking-letter-1 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #fc5d91;
        box-shadow: 0 0 16px #fc5d91;
    }

    100% {
        opacity: 1;
    }
}

@-o-keyframes blinking-letter-1 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #fc5d91;
        box-shadow: 0 0 16px #fc5d91;
    }

    100% {
        opacity: 1;
    }
}

@keyframes blinking-letter-1 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #fc5d91;
        box-shadow: 0 0 16px #fc5d91;
    }

    100% {
        opacity: 1;
    }
}

@-webkit-keyframes blinking-letter-2 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #52b6fa;
        box-shadow: 0 0 16px #52b6fa;
    }

    100% {
        opacity: 1;
    }
}

@-moz-keyframes blinking-letter-2 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #52b6fa;
        box-shadow: 0 0 16px #52b6fa;
    }

    100% {
        opacity: 1;
    }
}

@-ms-keyframes blinking-letter-2 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #52b6fa;
        box-shadow: 0 0 16px #52b6fa;
    }

    100% {
        opacity: 1;
    }
}

@-o-keyframes blinking-letter-2 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #52b6fa;
        box-shadow: 0 0 16px #52b6fa;
    }

    100% {
        opacity: 1;
    }
}

@keyframes blinking-letter-2 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #52b6fa;
        box-shadow: 0 0 16px #52b6fa;
    }

    100% {
        opacity: 1;
    }
}

@-webkit-keyframes blinking-letter-3 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #fcc56c;
        box-shadow: 0 0 16px #fcc56c;
    }

    100% {
        opacity: 1;
    }
}

@-moz-keyframes blinking-letter-3 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #fcc56c;
        box-shadow: 0 0 16px #fcc56c;
    }

    100% {
        opacity: 1;
    }
}

@-ms-keyframes blinking-letter-3 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #fcc56c;
        box-shadow: 0 0 16px #fcc56c;
    }

    100% {
        opacity: 1;
    }
}

@-o-keyframes blinking-letter-3 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #fcc56c;
        box-shadow: 0 0 16px #fcc56c;
    }

    100% {
        opacity: 1;
    }
}

@keyframes blinking-letter-3 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #fcc56c;
        box-shadow: 0 0 16px #fcc56c;
    }

    100% {
        opacity: 1;
    }
}

@-webkit-keyframes blinking-letter-4 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #4cf6d4;
        box-shadow: 0 0 16px #4cf6d4;
    }

    100% {
        opacity: 1;
    }
}

@-moz-keyframes blinking-letter-4 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #4cf6d4;
        box-shadow: 0 0 16px #4cf6d4;
    }

    100% {
        opacity: 1;
    }
}

@-ms-keyframes blinking-letter-4 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #4cf6d4;
        box-shadow: 0 0 16px #4cf6d4;
    }

    100% {
        opacity: 1;
    }
}

@-o-keyframes blinking-letter-4 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #4cf6d4;
        box-shadow: 0 0 16px #4cf6d4;
    }

    100% {
        opacity: 1;
    }
}

@keyframes blinking-letter-4 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #4cf6d4;
        box-shadow: 0 0 16px #4cf6d4;
    }

    100% {
        opacity: 1;
    }
}

@-webkit-keyframes blinking-letter-5 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #c97ee8;
        box-shadow: 0 0 16px #c97ee8;
    }

    100% {
        opacity: 1;
    }
}

@-moz-keyframes blinking-letter-5 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #c97ee8;
        box-shadow: 0 0 16px #c97ee8;
    }

    100% {
        opacity: 1;
    }
}

@-ms-keyframes blinking-letter-5 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #c97ee8;
        box-shadow: 0 0 16px #c97ee8;
    }

    100% {
        opacity: 1;
    }
}

@-o-keyframes blinking-letter-5 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #c97ee8;
        box-shadow: 0 0 16px #c97ee8;
    }

    100% {
        opacity: 1;
    }
}

@keyframes blinking-letter-5 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #c97ee8;
        box-shadow: 0 0 16px #c97ee8;
    }

    100% {
        opacity: 1;
    }
}

@-webkit-keyframes blinking-letter-6 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #f27568;
        box-shadow: 0 0 16px #f27568;
    }

    100% {
        opacity: 1;
    }
}

@-moz-keyframes blinking-letter-6 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #f27568;
        box-shadow: 0 0 16px #f27568;
    }

    100% {
        opacity: 1;
    }
}

@-ms-keyframes blinking-letter-6 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #f27568;
        box-shadow: 0 0 16px #f27568;
    }

    100% {
        opacity: 1;
    }
}

@-o-keyframes blinking-letter-6 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #f27568;
        box-shadow: 0 0 16px #f27568;
    }

    100% {
        opacity: 1;
    }
}

@keyframes blinking-letter-6 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
        border-color: #f27568;
        box-shadow: 0 0 16px #f27568;
    }

    100% {
        opacity: 1;
    }
}

@-webkit-keyframes blinking-hand {
    0% {
        margin-left: 20px;
    }

    50% {
        margin-left: 0;
    }

    100% {
        margin-left: 20px;
    }
}

@-moz-keyframes blinking-hand {
    0% {
        margin-left: 20px;
    }

    50% {
        margin-left: 0;
    }

    100% {
        margin-left: 20px;
    }
}

@-ms-keyframes blinking-hand {
    0% {
        margin-left: 20px;
    }

    50% {
        margin-left: 0;
    }

    100% {
        margin-left: 20px;
    }
}

@-o-keyframes blinking-hand {
    0% {
        margin-left: 20px;
    }

    50% {
        margin-left: 0;
    }

    100% {
        margin-left: 20px;
    }
}

@keyframes blinking-hand {
    0% {
        margin-left: 20px;
    }

    50% {
        margin-left: 0;
    }

    100% {
        margin-left: 20px;
    }
}

div.selected-chars {
    height: 72px;
}

span.selected-chars {
    background-color: white;
    color: #E74C3C;
    border: 7px solid #E74C3C;
    font-size: 34px;
    line-height: 41px;
    display: inline-block;
    height: 54px;
    padding: 0 20px;
    -ms-border-radius: 27px;
    -moz-border-radius: 27px;
    -webkit-border-radius: 27px;
    border-radius: 27px;
    margin-top: 15px;
    cursor: pointer;
    position: relative;
    /*text-transform: uppercase;*/
}

    span.selected-chars > .cross {
        display: none;
    }

    span.selected-chars.not-empty > .cross {
        display: block;
        content: "x";
        position: absolute;
        color: #E74C3C;
        background: white;
        -ms-border-radius: 15px;
        -moz-border-radius: 15px;
        -webkit-border-radius: 15px;
        border-radius: 15px;
        width: 25px;
        height: 25px;
        font-size: 17px;
        font-weight: bold;
        line-height: 20px;
        z-index: 5;
        border: 3px solid #E74C3C;
        right: -10px;
        top: -10px;
    }

    span.selected-chars.highlighted {
        border-color: #2ecc71;
        color: #2ecc71;
        position: relative;
    }

        span.selected-chars.highlighted::before {
            content: " ";
            position: absolute;
            background-color: #E74C3C;
            height: 7px;
            width: 80%;
            left: 10%;
            top: 17px;
            -webkit-animation: strikouted-word 0.3s 1 normal linear;
            -moz-animation: strikouted-word 0.3s 1 normal linear;
            -ms-animation: strikouted-word 0.3s 1 normal linear;
            -o-animation: strikouted-word 0.3s 1 normal linear;
            animation: strikouted-word 0.3s 1 normal linear;
        }

@-webkit-keyframes strikouted-word {
    0% {
        width: 0;
    }

    100% {
        width: 80%;
    }
}

@-moz-keyframes strikouted-word {
    0% {
        width: 0;
    }

    100% {
        width: 80%;
    }
}

@-ms-keyframes strikouted-word {
    0% {
        width: 0;
    }

    100% {
        width: 80%;
    }
}

@-o-keyframes strikouted-word {
    0% {
        width: 0;
    }

    100% {
        width: 80%;
    }
}

@keyframes strikouted-word {
    0% {
        width: 0;
    }

    100% {
        width: 80%;
    }
}

div.word-answer {
    text-align: center;
    /*text-transform: uppercase;*/
}

.gameplay {
    height: 100%;
    position: relative;
}

    .gameplay > .button.save, .gameplay > .button.new-game {
        width: 156px;
        margin-top: 14px;
    }

    .gameplay > .button.end-game {
        width: 156px;
        position: fixed;
        top: 8px;
        z-index: 5;
        left: calc(50% - 78px);
    }

    .gameplay > .button.hint {
        position: absolute;
        left: 10px;
        top: 20px;
    }

        .gameplay > .button.hint > .popup {
            left: 0;
            top: 59px;
        }

    .gameplay > .button.hint > .popup::before {
        left:12px
    }

    .gameplay > .floating-message {
        left: 0;
        top: 150px;
    }

@media (max-width:630px) {
    .gameplay > .floating-message {
        top: 333px;
    }
}

.gameplay > .button.hint.shaking {
    -webkit-animation: shaking-letter 0.1s 3 normal linear;
    -moz-animation: shaking-letter 0.1s 3 normal linear;
    -ms-animation: shaking-letter 0.1s 3 normal linear;
    -o-animation: shaking-letter 0.1s 3 normal linear;
    animation: shaking-letter 0.1s 3 normal linear;
}

.gameplay > .button.hint.tilting {
    -webkit-animation: tilting-letter 0.5s 3 normal linear;
    -moz-animation: tilting-letter 0.5s 3 normal linear;
    -ms-animation: tilting-letter 0.5s 3 normal linear;
    -o-animation: tilting-letter 0.5s 3 normal linear;
    animation: tilting-letter 0.5s 3 normal linear;
}



.round-results > .button.save, .round-results > .button.new-game {
    width: 166px;
    position: relative;
    padding: 7px;
}

.gameplay > .button.save,
.round-results > .button.save {
    margin-right: 18px;
}

div > .popup, .hyperlink > .popup {
    font-weight: bold;
    position: absolute;
    left: calc(50% - 170px);
    right: auto;
    width: 345px;
    display: none;
    margin-bottom: 15px;
    z-index: 5;
}

.hyperlink > .popup, .hyperlink:hover > .popup {
    text-decoration: none;
    color: #2C3E50;
}

    div > .popup.looking-up, .hyperlink > .popup.looking-up {
        bottom: 45px;
        top: auto;
    }

.shortcut {
    font-size: 12px;
    color: #777777;
    position: absolute;
    bottom: -20px;
    width: 100%;
    left: 0;
    text-align: center;
}

div > .popup:not(.looking-up)::before, .hyperlink > .popup:not(.looking-up)::before {
    content: "";
    position: absolute;
    width: 25px;
    height: 25px;
    background: white;
    transform: rotate(45deg);
    top: -11px;
    z-index: -1;
    box-shadow: -1px -1px 8px -2px rgba(0, 0, 0, 0.5);
    left: 160px;
}
.hyperlink > .popup:not(.looking-up)::after {
    content: "";
    position: absolute;
    width: 45px;
    height: 20px;
    background: white;
    top: 0;
    left: 175px;
}
/*div > .popup:not(.looking-up)::before, .hyperlink > .popup:not(.looking-up)::before {
    content: " ";
    position: absolute;
    width: 0;
    height: 0;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-bottom: 15px solid white;
    top: -15px;
    left: 155px;
}*/

div > .popup.looking-up::before, .hyperlink > .popup.looking-up::before {
    content: " ";
    position: absolute;
    width: 0;
    height: 0;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-top: 15px solid white;
    bottom: -14px;
    left: 155px;
}

div > .popup, .hyperlink > .popup {
    top: 56px;
}

.gameplay > div > .popup {
    top: 61px;
}


div > .popup > .listview {
    border-top: none;
    border-bottom: none;
}

.button > .overlay {
    display: none;
    cursor: default;
}

.button:focus {
    outline: 0;
}

.button.white.pushed {
    background-color: #556676;
    color: white;
}

.button.dark-blue.pushed {
    background-color: #556676;
}

div.pushed > .popup, .hyperlink.pushed > .popup {
    display: block;
}

.gameplay > .found-words {
    /*max-height: calc(100% - 454px);
	min-height: 65px;*/
    overflow: auto;
}

.gameplay > div > div.word-answer {
    float: left;
    width: 33%;
    margin-top: 14px;
}

div.word-answer > span {
    color: white;
    border: 4px solid #34495E;
    background-color: #34495E;
    font-size: 18px;
    line-height: 26px;
    overflow: hidden;
    display: inline-block;
    height: 34px;
    -moz-min-width: 34px;
    -ms-min-width: 34px;
    -o-min-width: 34px;
    -webkit-min-width: 34px;
    min-width: 34px;
    padding: 0 4px;
    -ms-border-radius: 17px;
    -moz-border-radius: 17px;
    -webkit-border-radius: 17px;
    border-radius: 17px;
}

    div.word-answer > span > .hinted {
        color: #f39c12;
    }
    div.word-answer > span > .guessed {
        color: black;
    }


div.word-answer.already-found > span {
    background-color: #E74C3C;
    border-color: #E74C3C;
    transition: all 0.1s linear;
}

div.word-answer.newly-found > span {
    -webkit-animation: highlighted-green-word 0.5s 1 normal linear;
    -moz-animation: highlighted-green-word 0.5s 1 normal linear;
    -ms-animation: highlighted-green-word 0.5s 1 normal linear;
    -o-animation: highlighted-green-word 0.5s 1 normal linear;
    animation: highlighted-green-word 0.5s 1 normal linear;
}

@-webkit-keyframes highlighted-green-word {
    0% {
        background-color: #2ecc71;
        border-color: #2ecc71;
    }

    100% {
        background-color: #34495E;
        font-size: 34px;
        border-color: #34495E;
    }
}

@-moz-keyframes highlighted-green-word {
    0% {
        background-color: #2ecc71;
        border-color: #2ecc71;
    }

    100% {
        background-color: #34495E;
        font-size: 34px;
        border-color: #34495E;
    }
}

@-ms-keyframes highlighted-green-word {
    0% {
        background-color: #2ecc71;
        border-color: #2ecc71;
    }

    100% {
        background-color: #34495E;
        font-size: 34px;
        border-color: #34495E;
    }
}

@-o-keyframes highlighted-green-word {
    0% {
        background-color: #2ecc71;
        border-color: #2ecc71;
    }

    100% {
        background-color: #34495E;
        font-size: 34px;
        border-color: #34495E;
    }
}

@keyframes highlighted-green-word {
    0% {
        background-color: #2ecc71;
        border-color: #2ecc71;
    }

    100% {
        background-color: #34495E;
        font-size: 34px;
        border-color: #34495E;
    }
}

span.button-close {
    width: 34px;
    height: 34px;
    background: url(../img/quit.png?r=2) no-repeat;
    display: inline-block;
    margin-top: 14px;
    cursor: pointer;
    float: left;
}

.win-animation > span.button-close {
    margin-left: 14px;
    margin-right: -48px;
}

div.score-sum > span, div.header > span.time-left {
    font-weight: normal;    
    font-size: 18px;
    display: inline-block;
    line-height: 25px;
    max-height: 34px;
    margin-top: 20px;
}

    div.score-sum > span.score {
        margin-top: 0px;
    }

span.score:not(.label) {
    color: #ed145b;
}
span.score.streak{
    color:#3498db;
}

div.score-sum > span.score.label, div.score-sum > span.total-words-count.label {
    margin-left: 3px;
}

div.score-sum > span.found-words-count, div.score-sum > span.total-words-count {
    line-height: normal;
    height: auto;
}

span.found-words-count {
    color: #1abc9c;
}

span.total-words-count {
    color: black;
}

span.time-left {
    color: #3498db;
}

    span.time-left.hurry-up {
        color: red;
    }

*.unselectable {
    -moz-user-select: -moz-none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
}

*.selectable-text {
    -moz-user-select: -moz-text;
    -khtml-user-select: text;
    -webkit-user-select: text;
    -ms-user-select: text;
    -o-user-select: text;
    user-select: text;
}

.game-menu > .main-menu {
    height: calc(100% - 29px);
}

    .game-menu > .main-menu > .subheader {
        width: 100%;
    }

div.profile-info-navbar {
    height: 65px;
    margin: 14px auto;
}

    div.profile-info-navbar > .button {
        margin: 7px;
    }

        div.profile-info-navbar > .button.refresh {
            font-size: 25px;
            float: left;
            margin: 7px 0 7px 46px;
        }

        div.profile-info-navbar > .button.new-game {
            padding-left: 7px;
            margin-top: 18px;
            line-height: 26px;
        }

            div.profile-info-navbar > .button.new-game::before {
                content: "+";
                color: #2ecc71;
                font-size: 30px;
                font-weight: bold;
                line-height: 27px;
                font-family: Arial;
                width: 27px;
                height: 27px;
                float: left;
                background-color: white;
                -ms-border-radius: 15px;
                -moz-border-radius: 15px;
                -webkit-border-radius: 15px;
                border-radius: 15px;
                margin-right: 7px;
            }

    div.profile-info-navbar > span.achievements {
        float: left;
        background: url(../img/achievements.png?r=3) no-repeat;
    }

    div.profile-info-navbar > span.ranking {
        background: url(../img/ranking.png?r=3) no-repeat;
    }

    div.profile-info-navbar > span.statistics {
        float: right;
        background: url(../img/statistics.png?r=3) no-repeat;
    }

    div.profile-info-navbar > span.achievements, div.profile-info-navbar > span.ranking, div.profile-info-navbar > span.statistics {
        display: inline-block;
        width: 130px;
        height: 81px;
        cursor: pointer;
        background-position: 43px 0;
        font-size: 16px;
        padding: 48px 0 0 0;
        line-height: 17px;
        overflow: hidden;
        transition: all 0.3s linear;
    }

        div.profile-info-navbar > span.achievements:hover, div.profile-info-navbar > span.ranking:hover, div.profile-info-navbar > span.statistics:hover {
            opacity: 0.8;
        }

.games-list {
    height: calc(100% - 143px);
    overflow: auto;
}

.main-menu > .games-list > div > .listview > div > .button, .game-menu > .ranking > .listview > div:not(.pager) > .button, .players-list > .listview > div > .button, .new-game-social > .new-game > .listview > div:not(.pager) > .button, .game-results > .buttons.share-and-details > .button {
    width: 155px;
    text-align: center;
    padding: 7px;
}

    .main-menu > .games-list > div > .listview > div > .button.with-icon,
    .game-menu > .ranking > .listview > div > .button.with-icon,
    .new-game-social > .new-game > .listview > div > .button.with-icon,
    .players-list > .listview > div > .button.with-icon {
        padding: 4px;
    }

        .main-menu > .games-list > div > .listview > div > .button.with-icon > span:not(.round),
        .game-menu > .ranking > .listview > div > .button.with-icon > span:not(.round),
        .new-game-social > .new-game > .listview > div > .button.with-icon > span:not(.round),
        .players-list > .listview > div > .button.with-icon > span:not(.round) {
            float: none;
            margin-top: 3px;
            padding-right: 27px;
            display: inline-block;
        }

.game-menu > .ranking {
    height: calc(100% - 10px);
    overflow: auto;
}

    .game-menu > .ranking > .listview {
        border-top: none;
        height: calc(100% - 154px);
        overflow: auto;
    }

        .game-menu > .ranking > .listview.no-friends {
            height: auto;
            max-height: calc(100% - 154px);
        }

.listview {
    white-space: normal;
    transition: all 0.1s linear;
}

    .listview > .pager:first-child {
        border-bottom: 1px solid #c4c8c7;
    }


    .listview > .pager {
        text-align: center;
        padding: 9px;
    }

        .listview > .pager > .button {
            font-size: 16px;
            float: none;
            margin: 6px;
            width: 146px;
            padding: 3px 7px 3px 5px;
        }

            .listview > .pager > .button.small {
                padding: 3px;
                width: 30px;
                -ms-border-radius: 15px;
                -moz-border-radius: 15px;
                -webkit-border-radius: 15px;
                border-radius: 15px;
            }

        .listview > .pager:active {
            color: white;
        }

.game-menu > .ranking > .listview > div > .rank {
    float: left;
    font-weight: normal;
    font-size: 18px;
    width: 50px;
    text-align: center;
    margin-top: 11px;
    color: #34495e;
}

.game-menu > .ranking > .listview > div.me {
    background-color: #ffffda;
}

.game-menu > .ranking > div.listview > div > div.header, .game-menu > .ranking > div.listview > div > div.subheader {
    margin-left: 117px;
}

.game-menu > .ranking > .listview > div > .profile {
    margin: 3px 3px 3px 5px;
}

.game-menu > .ranking > .note {
    font-size: 16px;
    white-space: nowrap;
    height: 23px;
}

    .game-menu > .ranking > .note > .button {
        margin-top: 20px;
    }

.game-menu > .ranking > .selector.blue {
    font-size: 17px;
    margin: 10px 5px 5px 5px;
}

.game-menu > .ranking > .selector.dark-blue {
    font-size: 17px;
    margin: 5px 0 0 0;
    white-space: nowrap;
}

.main-menu > .games-list > div > .listview > div > .header, .ranking > .listview > div > .header {
    overflow: hidden;
}
.games-list> div.challenges, .games-list> div.your-turn, .games-list> div.waiting-for-opponent, .games-list> div.completed-games, .games-list> div.saved-games {
    margin-left: 1px;
    margin-right: 1px;
}

div.challenges > div.header, div.your-turn > div.header, div.waiting-for-opponent > div.header, div.completed-games > div.header, div.saved-games > div.header {
    font-size: 18px;
    color: white;
    /*font-weight: normal;*/
}

div.challenges > div.header, div.your-turn > div.header {
    background-color: #1abc9c;
}

div.challenges.social > div.header {
    background-color: #3b5998;
}

div.waiting-for-opponent > div.header {
    background-color: #f1c40f;
}

div.completed-games > div.header {
    background-color: #2c3e50;
}

div.saved-games > div.header {
    background-color: #3498db;
}

div.listview > div {
    background-color: #ffffff;
    background-color:rgba(255,255,255,.9);
}

div.listview:not(.borderless) {
    /*border-top: 1px solid #e5e7e9;*/
    /*border-bottom: 1px solid #c4c8c7;*/
}

div.listview > div {
    text-align: left;
    transition: all 0.3s linear;

}


div.listview.clickable > div:hover:not(.spacer):not(.not-clickable),
div.listview.simple.clickable > div:hover:not(.not-clickable) {
    cursor: pointer;
    background-color: #f1f1f1;
    background-color:rgba(255,255,255,.95);
}


div.listview.clickable > div:active:not(.spacer):not(.not-clickable),
div.listview.simple.clickable > div:active:not(.not-clickable) {
    background-color: #34495e;
}

    div.listview.clickable > div:active:not(.spacer):not(.not-clickable) > div,
    div.listview.simple.clickable > div:active:not(.not-clickable) > div {
        color: white;
    }

div.listview.clickable > div.not-clickable:hover {
    cursor: default;
}

div.listview.clickable > div.pager:active, div.listview.clickable > div.pager:hover {
    background: white;
    cursor: default;
}

div.listview > div.spacer {
    background-color: transparent;
    height: 27px;
}

div.listview > div > div.header {
    font-size: 16px;
    color: #34495e;
    height: 29px;
    padding-top: 7px;
    margin-left: 67px;
}

div.listview > div > div.subheader {
    font-size: 11px;
    line-height: 14px;
    height: 29px;
    color: #808d8e;
    margin-left: 67px;
}

    div.listview > div > div.subheader > a {
        color: #808d8e;
        text-decoration: underline;
        transition: all 0.1s ease;
    }

        div.listview > div > div.subheader > a:hover {
            text-decoration: none;
            color: #c0c0c0;
        }

.listview > div > .subheader > .highlight {
    color: #34495e;
}

.listview > div:active > .subheader > .highlight {
    color: white;
    font-weight: bold;
}

div.listview > div > div.submenu {
    float: right;
    background-image: url(../img/arrow-right.png?r=2);
    width: 43px;
    height: 43px;
    margin: 7px 20px;
    transition: all 0.1s ease;
}

div.listview.expanded > div > div.submenu {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg);
    transition: all 0.1s ease;
}

div.listview > div:not(:last-child) > div.subheader {
    border-bottom: 1px solid #c4c8c7;
}

div.new-game > .listview > div {
    background-repeat: no-repeat;
    background-position: 9px;
}

    div.new-game > .listview > div.previous {
        background-image: url(../img/previous-opponent.png?r=2);
    }

    div.new-game > .listview > div.random {
        background-image: url(../img/random-opponent.png?r=2);
    }

    div.new-game > .listview > div.offline {
        background-image: url(../img/profile.png?r=2);
    }

div.achievements > .listview > div {
    background-repeat: no-repeat;
    background-position: 11px;
}

.listview > div > .share-and-details, .listview > .share-and-details {
    float: right;
    margin-top: 7px;
}

    .listview > div > .share-and-details > span, .listview > .share-and-details > span {
        display: inline-block;
    }

div.achievements > .listview > div.inactive > div.header, div.achievements > .listview > div.inactive > div.subheader {
    color: #bfc5c9;
}

div.achievements > .listview > div.ach-0.inactive {
    background-image: url(../img/ach/0.png?r=2);
}

div.achievements > .listview > div.ach-1.inactive {
    background-image: url(../img/ach/1.png?r=2);
}

div.achievements > .listview > div.ach-2.inactive {
    background-image: url(../img/ach/2.png?r=2);
}

div.achievements > .listview > div.ach-3.inactive {
    background-image: url(../img/ach/3.png?r=2);
}

div.achievements > .listview > div.ach-4.inactive {
    background-image: url(../img/ach/4.png?r=2);
}

div.achievements > .listview > div.ach-5.inactive {
    background-image: url(../img/ach/5.png?r=2);
}

div.achievements > .listview > div.ach-6.inactive {
    background-image: url(../img/ach/6.png?r=2);
}

div.achievements > .listview > div.ach-7.inactive {
    background-image: url(../img/ach/7.png?r=2);
}

div.achievements > .listview > div.ach-8.inactive {
    background-image: url(../img/ach/8.png?r=2);
}

div.achievements > .listview > div.ach-9.inactive {
    background-image: url(../img/ach/9.png?r=2);
}

div.achievements > .listview > div.ach-10.inactive {
    background-image: url(../img/ach/10.png?r=2);
}

div.achievements > .listview > div.ach-11.inactive {
    background-image: url(../img/ach/11.png?r=2);
}

div.achievements > .listview > div.ach-0 {
    background-image: url(../img/ach/0-a.png?r=2);
}

div.achievements > .listview > div.ach-1 {
    background-image: url(../img/ach/1-a.png?r=2);
}

div.achievements > .listview > div.ach-2 {
    background-image: url(../img/ach/2-a.png?r=2);
}

div.achievements > .listview > div.ach-3 {
    background-image: url(../img/ach/3-a.png?r=2);
}

div.achievements > .listview > div.ach-4 {
    background-image: url(../img/ach/4-a.png?r=2);
}

div.achievements > .listview > div.ach-5 {
    background-image: url(../img/ach/5-a.png?r=2);
}

div.achievements > .listview > div.ach-6 {
    background-image: url(../img/ach/6-a.png?r=2);
}

div.achievements > .listview > div.ach-7 {
    background-image: url(../img/ach/7-a.png?r=2);
}

div.achievements > .listview > div.ach-8 {
    background-image: url(../img/ach/8-a.png?r=2);
}

div.achievements > .listview > div.ach-9 {
    background-image: url(../img/ach/9-a.png?r=2);
}

div.achievements > .listview > div.ach-10 {
    background-image: url(../img/ach/10-a.png?r=2);
}

div.achievements > .listview > div.ach-11 {
    background-image: url(../img/ach/11-a.png?r=2);
}

div.button {
    -moz-transition: all 0.3s linear, visibility none;
    -o-transition: all 0.3s linear, visibility none;
    -webkit-transition: all 0.3s linear, visibility none;
    transition: all 0.3s linear, visibility none;
    font-size: 17px;
    display: inline-block;
    padding: 7px 15px;
    -ms-border-radius: 20px;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    border-radius: 20px;
}

    div.button.green {
        color: white;
        background-color: #2ecc71;
    }

        div.button.green:hover {
            background-color: #186c3c;
            cursor: pointer;
        }

        div.button.green:active {
            box-shadow: 0 0 4px #2ecc71;
        }

    div.button.orange {
        color: white;
        background-color: #F1C40F;
    }

        div.button.orange:hover {
            background-color: #DDB40F;
            cursor: pointer;
        }

        div.button.orange:active {
            box-shadow: 0 0 4px #F1C40F;
        }

    div.button.vivid-orange {
        color: white;
        background-color: #f39c12;
        box-shadow: 0 0 4px transparent;
    }

.button.vivid-orange.pushed {
    background-color: #f3ac42;
}

div.button.vivid-orange:hover {
    background-color: #f3ac42;
    cursor: pointer;
}

div.button.vivid-orange:active {
    box-shadow: 0 0 4px #f39c12;
}

div.button.red {
    color: white;
    background-color: #E74C3C;
    box-shadow: 0 0 4px transparent;
}

.button.red.pushed {
    background-color: #ff7f73;
}

div.button.red:hover {
    background-color: #ff7f73;
    cursor: pointer;
}

div.button.red:active {
    box-shadow: 0 0 4px #E74C3C;
}

div.button.gray {
    color: white;
    background-color: #95a5a6;
}

    div.button.gray.disabled {
        color: #95a5a6;
        background-color: transparent;
        border: 1px solid #95a5a6;
    }

    div.button.gray:hover:not(.disabled) {
        background-color: #556676;
        cursor: pointer;
    }

    div.button.gray:active {
        box-shadow: 0 0 4px #95a5a6;
    }

div.button.white {
    color: #7f8c8d;
    background-color: #ffffff;
}

    div.button.white:hover {
        background-color: #556676;
        color: white;
        cursor: pointer;
    }

    div.button.white:active {
        box-shadow: 0 0 4px white;
    }

div.button.dark-blue {
    color: white;
    background-color: #34495e;
}

    div.button.dark-blue:hover {
        background-color: #556676;
        cursor: pointer;
    }

    div.button.dark-blue:active {
        box-shadow: 0 0 4px #34495e;
    }

div.button.blue {
    color: white;
    background-color: #3498db;
}

    div.button.blue:hover {
        background-color: #3468ab;
        cursor: pointer;
    }

    div.button.blue:active {
        box-shadow: 0 0 4px #3498db;
    }

.listview > div > .profile {
    float: left;
    width: 50px;
    height: 50px;
    -ms-border-radius: 25px;
    -moz-border-radius: 25px;
    -webkit-border-radius: 25px;
    border-radius: 25px;
    margin: 3px 3px 3px 5px;
}

.listview > div > div.button {
    float: right;
    margin-top: 7px;
    margin-right: 19px;
}

.listview > div > .cup {
    float: right;
    margin-right: 12px;
    margin-top: 12px;
}

div.statistics > .playerInfo {
    background-color: #2c3e50;
    padding-bottom: 20px;
}

div.completed-games.listview > div {
    background-repeat: no-repeat;
    background-position: 20px;
}

    div.completed-games.listview > div > .header {
        padding-top: 10px;
        padding-left: 10px;
        height: 39px;
    }

.stack-left > div {
    float: left;
}

.statistics > div > .stack-left > div:first-child {
    font-size: 16px;
    background-color: white;
    height: 60px;
    width: 120px;
    padding-top: 17px;
    color: #34495e;
    border-bottom: 1px solid #c4c8c7;
    border-top: 1px solid #e5e7e9;
    border-right: 1px solid #e5e7e9;
}

.statistics > div > .stack-left > div:last-child {
    width: calc(100% - 120px);
}

.statistics > div > .stack-left > div > div.listview > div > .header {
    white-space: nowrap;
}

div.completed-games.listview > div > .subheader {
    height: 19px;
}

div.statistics > div.playerInfo > div.profile {
    text-align: left;
}

    div.statistics > div.playerInfo > div.profile > .cup {
        font-size: 16px;
        padding-left: 36px;
        color: #7f8c8d;
        width: auto;
        margin: 10px;
        line-height: 30px;
        cursor: pointer;
    }

    div.statistics > div.playerInfo > div.profile > img.avatar {
        width: 68px;
        height: 68px;
        -ms-border-radius: 35px;
        -moz-border-radius: 35px;
        -webkit-border-radius: 35px;
        border-radius: 35px;
        margin: 25px 0 0 26px;
    }

    div.statistics > div.playerInfo > div.profile > div.name {
        font-size: 18px;
        color: white;
        margin: 4px 0 13px 26px;
    }

        div.statistics > div.playerInfo > div.profile > div.name > span.facebook-24, div.statistics > div.playerInfo > div.profile > div.name > span.google-24, div.statistics > div.playerInfo > div.profile > div.name > span.vkontakte-24 {
            display: inline-block;
            height: 28px;
            background-position: 0 4px;
        }

div.statistics > div.playerInfo > div.numbers {
    float: right;
    text-align: right;
    margin: 20px 26px 0 0;
}

div.statistics > div.playerInfo > div > .header, div.statistics > div.playerInfo > div > .value {
    font-size: 18px;
    line-height: 25px;
}

div.statistics > div.playerInfo > div > .header {
    color: #7f8c8d;
}

div.statistics > div.playerInfo > div > .value {
    color: #f39c12;
}

    div.statistics > div.playerInfo > div > .value.hint {
        font-size: 14px;
        line-height: 1;
    }

    div.statistics > div.playerInfo > div > .value.clickable, div.statistics > div.playerInfo > div > .value > .clickable {
        cursor: pointer;
        text-decoration: underline;
    }

        div.statistics > div.playerInfo > div > .value.clickable:hover, div.statistics > div.playerInfo > div > .value > .clickable:hover {
            text-decoration: none;
            color: #ffc15f;
        }

div.statistics > div.playerInfo > .buttons {
    height: 58px;
    position: relative;
}

    div.statistics > div.playerInfo > .buttons > div.button {
        margin: 14px 7px 0 7px;
    }

        div.statistics > div.playerInfo > .buttons > div.button.gray {
            line-height: 19px;
        }

    div.statistics > div.playerInfo > .buttons > .hyperlink {
        position: absolute;
        top: 24px;
        right: 26px;
    }

    div.statistics > div.playerInfo > .buttons > div.button.big {
        width: calc(100% - 14px);
        padding-top: 3px;
        padding-bottom: 3px;
        margin-top: 6px;
    }

        div.statistics > div.playerInfo > .buttons > div.button.big .hint {
            font-size: 14px;
        }

    div.statistics > div.playerInfo > .buttons > div.button.left {
        float: left;
        margin-left: 20px;
    }

    div.statistics > div.playerInfo > .buttons > div.button.right {
        float: right;
        margin-right: 20px;
    }

    .statistics>div>.my-games-buttons,.statistics>div>.listview{
        margin-left:1px;
        margin-right:1px;
    }

div.listview.simple > div {
    background-color: white;
    background-color:rgba(255,255,255,.95);
}

    div.listview.simple > div > div.value {
        color: #3498db;
        float: right;
        font-size: 18px;
        margin: 7px 20px 0 0;
    }

    div.listview.simple > div > div.header, div.listview.simple > div > div.subheader {
        margin-left: 20px;
    }

    div.listview.simple > div > div.header {
        height: 29px;
        padding-top: 9px;
    }

    div.listview.simple > div > div.subheader {
        line-height: 7px;
        height: 15px;
    }

.players-list > .find-friends, .players-list > .no-results, .new-game.friends > .no-results {
    font-size: 17px;
    color: #34495e;
    height: 57px;
    padding: 7px;
    white-space: nowrap;
}

.new-game.friends > .no-results, .listview > .no-results {
    background-color: white;
    border-bottom: 1px solid #c4c8c7;
    line-height: 40px;
}

    .players-list > .no-results > label, .new-game.friends > .no-results > label {
        cursor: pointer;
    }

.players-list > .find-friends > .button.green {
    padding-top: 4px;
    padding-bottom: 4px;
}

.players-list > div.listview > div > div.header {
    padding-top: 14px;
    height: 41px;
}

.players-list > div.listview > div > div.subheader {
    height: 15px;
}

div.listview.simple > div > div.submenu {
    margin: 4px;
}

div.login-tfd {
    font-size: 18px;
    color: #34495e;
}

    div.login-tfd > div.ticket > .error {
        color: red;
    }

    div.login-tfd > div.ticket {
        background-color: white;
        text-align: left;
        padding: 11px 20px;
        text-align: center;
    }

        div.login-tfd > div.ticket > div:not(:last-child) {
            margin-bottom: 16px;
        }

input[type=text], input[type=email], input[type=password], select {
    -ms-border-radius: 7px;
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
    border-radius: 7px;
    border: 1px solid #c4c8c7;
    padding: 4px;
    font-size: 18px;
}

div.login-tfd > div.ticket input.email {
    width: 310px;
    background: none;
}

div.login-tfd > div.ticket input.password {
    width: 271px;
}

div.login-tfd > div.ticket input.name {
    width: 241px;
}

div.button-fullsize {
    padding: 14px;
}

    div.button-fullsize.blue {
        color: white;
        background-color: #3498db;
        cursor: pointer;
    }

div.login-tfd > div.button-fullsize {
    margin-bottom: 14px;
}

div.challenges > .listview > div,
div.your-turn > .listview > div,
div.waiting-for-opponent > .listview > div,
div.saved-games > .listview > div,
div.completed-games > .listview > div {
    background-color: white;
}

div.game-results, div.round-results {
    padding: 0 27px 0 27px;
    height: 100%;
    overflow: auto;
}

div.round-results {
    position: relative;
}

.game-results > .win-animation > .bookman-dance {
    display: inline-block;
}

.game-results > .win-animation, .game-results > .win-animation > video {
    height: 0;
    opacity: 0;
    transition: all 5s ease;
}

    .game-results > .win-animation > .rating {
        font-size: 18px;
        position: relative;
        color: transparent;
    }

        .game-results > .win-animation > .rating > span.flying, .game-results > .win-animation > .rating > span.static {
            margin-left: -20px;
            position: absolute;
            left: 50%;
            top: 5px;
            display: inline-block;
            width: 40px;
            height: 40px;
            border-radius: 20px;
            border: 2px solid transparent;
            opacity: 0;
            line-height: 38px;
        }

        .game-results > .win-animation > .rating > span.static {
            border: 2px solid #2ecc71;
        }

    .game-results > .win-animation > .small-close {
        float: right;
        font-size: 28px;
        color: #95a5a6;
        margin: 10px 24px 0 -24px;
        cursor: pointer;
    }

        .game-results > .win-animation > .small-close:hover {
            color: #556676;
        }

    .game-results > .win-animation > .rating.started {
        color: black;
    }

    .game-results > .win-animation > .rating.done > span {
        color: black;
        transition: color 2s ease, text-shadow 2s ease, font-size 2s ease, left 0.5s linear, top 0.5s linear, margin-left 0.5s linear;
    }

    .game-results > .win-animation > .rating.done {
        color: transparent;
        transition: color 2s ease;
    }

    .game-results > .win-animation.show {
        margin-top: 24px;
        height: 330px;
        opacity: 1;
        transition: opacity 1s ease;
        background: rgba(255, 255, 255, 0.6);
    }

        .game-results > .win-animation.show > video {
            height: 250px;
            opacity: 1;
            transition: all 1s ease;
        }

    .game-results > .win-animation.hide, .game-results > .win-animation.hide > video {
        height: 0;
        opacity: 0;
        transition: all 0.7s ease;
        overflow: hidden;
    }

    .game-results > .win-animation > .rating.started > span.static, .game-results > .win-animation > .rating.done > span.static {
        opacity: 1;
    }

    .game-results > .win-animation > .rating.done > span.flying {
        opacity: 1;
        margin-left: 0;
        left: 146px;
        top: -373px;
    }

@media(max-width:687px) {
    .game-results > .win-animation > .rating.done > span.flying {
        left: 68px;
        top: -363px;
    }
}

.game-results > .win-animation.hide > .rating.done > span.flying {
    top: -85px;
    transition: all 0.7s ease;
}

.game-results > .win-animation > .rating.done > span.flying.hide {
    opacity: 0;
}


.round-results > .listview {
    max-height: calc(100% - 290px);
    min-height: 58px;
    overflow: auto;
}

    .round-results > .listview.narrow {
        max-height: calc(100% - 354px);
    }

@media(max-width:569px) {
    .round-results > .listview {
        max-height: calc(100% - 325px);
    }
}

.game-results > div > .profile-details {
    margin-top: 4px;
    max-width: 230px;
}

.game-results > .me > .profile-details, .game-results > .me > img.profile {
    float: left;
}

.game-results > .me > img.profile {
    margin-right: 9px;
}

.game-results > .opponent > .profile-details, .game-results > .opponent > img.profile {
    float: right;
}

.game-results > .opponent > img.profile {
    margin-left: 9px;
}

@media (max-width:687px) {
    .game-results > .me > .profile-details, .game-results > .me > img.profile, .game-results > .opponent > .profile-details, .game-results > .opponent > img.profile {
        float: none;
    }
}

.game-results > .me, .game-results > .opponent, .round-results > .me:not(.short), .round-results > .opponent {
    max-width: 50%;
}

    .game-results > div > .profile-details > .name,
    .round-results > .me > div.name, .round-results > .opponent > div.name {
        height: 28px;
        overflow: hidden;
    }

    .round-results > .me > div.name, .round-results > .opponent > div.name {
        margin-top: 4px;
    }

div.game-results > .me, div.game-results > .opponent,
div.round-results > div.me, div.round-results > div.opponent,
.round-results > .wide-results > .rating, .round-results > .wide-results > .answers, .round-results > .wide-results > .score,
.round-results > .narrow-results > .rating, .round-results > .narrow-results > .answers, .round-results > .narrow-results > .score,
.round-results > .answers-details > div > .score {
    font-size: 18px;
    color: #34495e;
    line-height: 26px;
}

    div.game-results > div > img.profile,
    div.round-results > div.me > img.profile, div.round-results img.profile,
    .level-packs > div > div > img.profile {
        width: 68px;
        height: 68px;
        -ms-border-radius: 35px;
        -moz-border-radius: 35px;
        -webkit-border-radius: 35px;
        border-radius: 35px;
    }

    div.game-results > .me, div.game-results > .opponent:not(.disabled),
    div.round-results > div:not(.disabled) > div.name, div.round-results > div:not(.disabled) > img.profile {
        cursor: pointer;
    }

div.game-results > .me,
div.round-results > div.me {
    float: left;
    text-align: left;
}

div.game-results > .opponent,
div.round-results > div.opponent {
    float: right;
    text-align: right;
}

div.game-results > div.rounds {
    clear: both;
    margin-top: 22px;
}

    div.game-results > div.rounds > div {
        margin-top: 4px;
    }

        div.game-results > div.rounds > div > div.header {
            color: #808d8e;
            /*background-color: white;*/
            display: inline-block;
            font-size: 16px;
            padding: 1px 9px 0;
            /*-ms-border-top-left-radius: 14px;
            -moz-border-top-left-radius: 14px;
            -webkit-border-top-left-radius: 14px;
            border-top-left-radius: 14px;
            -ms-border-top-right-radius: 14px;
            -moz-border-top-right-radius: 14px;
            -webkit-border-top-right-radius: 14px;
            border-top-right-radius: 14px;*/
            position: relative;

            /*-webkit-box-shadow: 0 2px 1px white, 0 0 1px rgba(80, 80, 80, 0.7);
               -moz-box-shadow: 0 2px 1px white, 0 0 1px rgba(80, 80, 80, 0.7);
                -ms-box-shadow: 0 2px 1px white, 0 0 1px rgba(80, 80, 80, 0.7);
                 -o-box-shadow: 0 2px 1px white, 0 0 1px rgba(80, 80, 80, 0.7);
                    box-shadow: 0 2px 1px white, 0 0 1px rgba(80, 80, 80, 0.7);*/

        }

            /*div.game-results > div.rounds > div > div.header:before, div.game-results > div.rounds > div > div.header:after {
                content: '';
                width: 19px;
                height: 18px;
                border: none;
                position: absolute;
                bottom: 0;
                border-top: 0;
            }

            div.game-results > div.rounds > div > div.header:before {
                border-left: 0;
                -ms-border-radius: 0 0 14px 0;
                -moz-border-radius: 0 0 14px 0;
                -webkit-border-radius: 0 0 14px 0;
                border-radius: 0 0 14px 0;
                left: -18px;
                box-shadow: 1px 1px 1px rgba(80, 80, 80, 0.13), 4px 4px 0 white;
            }


            div.game-results > div.rounds > div > div.header:after {
                border-right: 0;
                -ms-border-radius: 0 0 0 14px;
                -moz-border-radius: 0 0 0 14px;
                -webkit-border-radius: 0 0 0 14px;
                border-radius: 0 0 0 14px;
                right: -18px;
                box-shadow: -1px 1px 1px rgba(80, 80, 80, 0.13), -4px 4px 0 white;
            }*/


div.game-results div.score {
    font-size: 20px;
    line-height: 42px;
    border: 8px solid white;
    background-color: white;
    -ms-border-radius: 40px;
    -moz-border-radius: 40px;
    -webkit-border-radius: 40px;
    border-radius: 40px;
    height: 58px;
}

    div.game-results div.score > div.me, div.game-results div.score > div.opponent {
        -ms-border-radius: 22px;
        -moz-border-radius: 22px;
        -webkit-border-radius: 22px;
        border-radius: 22px;
        color: white;
        -moz-min-width: 42px;
        -ms-min-width: 42px;
        -o-min-width: 42px;
        -webkit-min-width: 42px;
        min-width: 42px;
        height: 42px;
    }

    div.game-results div.score > div.me {
        float: left;
        text-align: left;
        padding-left: 14px;
        padding-right: 14px;
        max-width: calc(100% - 42px);
        background-color: #3498db;
        display: inline-block;
    }

    div.game-results div.score > div.opponent {
        text-align: right;
        padding-right: 14px;
        background-color: #f6be1a;
    }

    div.game-results div.score.completed {
        cursor: pointer;
    }

    div.game-results div.score > div.me.empty {
        background-color: #bdc3c7;
        color: #dee1e3;
    }

    div.game-results div.score > div.opponent.empty {
        background-color: #dee1e3;
        color: #bdc3c7;
    }

    div.game-results div.score.total {
        margin-top: 22px;
    }

        div.game-results div.score.total > div.me, div.game-results div.score.total > div.opponent {
            padding: 0;
            text-align: center;
        }

        div.game-results div.score.total > div.opponent {
            float: right;
        }

        div.game-results div.score.total > span {
            color: #7f8c8d;
            font-size: 18px;
            display: inline-block;
        }

.round-results > .share-and-details {
    height: 71px;
    padding-top: 14px;
    padding-bottom: 10px;
    clear: both;
    white-space: nowrap;
}

    .game-results > .share-and-details > .facebook, .game-results > .share-and-details > .vkontakte, .game-results > .share-and-details > .twitter, .round-results > .share-and-details > .facebook, .round-results > .share-and-details > .vkontakte, .round-results > .share-and-details > .twitter {
        display: inline-block;
        margin-right: 9px;
        font-size: 17px;
        line-height: 43px;
    }

    .round-results > .share-and-details > .button {
        margin-right: 9px;
        position: relative;
    }

.share-and-details > .facebook, .share-and-details > .vkontakte, .share-and-details > .twitter, .share-and-details > .google {
    width: 43px;
    height: 43px;
    background-repeat: no-repeat;
    cursor: pointer;
    margin-right: 14px;
    -ms-border-radius: 24px;
    -moz-border-radius: 24px;
    -webkit-border-radius: 24px;
    border-radius: 24px;
}

.share-and-details > .facebook {
    background-image: url(../img/fb.png?r=2);
}

.share-and-details > .vkontakte {
    background-image: url(../img/vk.png);
}

.share-and-details > .twitter {
    background-image: url(../img/twitter.png?r=2);
}

.round-results > .hint {
    color: #7f8c8d;
    font-size: 16px;
    line-height: 29px;
}

    .round-results > .hint > .orange {
        color: #CD8512;
    }

.word-lookup {
    position: absolute;
    top: calc(50% - 200px);
    height: 480px;
    /*max-width: 784px;*/
    background: white;
    z-index: 1;
    padding-left: 16px;
}

@media(min-width:900px) {
    .word-lookup {
        left: calc(50% - 382px);
        right: calc(50% - 382px);
    }
}

@media(max-width:900px) {
    .word-lookup {
        left: 68px;
        right: 68px;
        -moz-min-width: 350px;
        -ms-min-width: 350px;
        -o-min-width: 350px;
        -webkit-min-width: 350px;
        min-width: 350px;
    }
}

.word-lookup > iframe {
    width: 100%;
    height: 480px;
    border: none;
}

.word-definition {
    -webkit-overflow-scrolling: touch;
    overflow-y: scroll;
}

    .word-definition > iframe {
        border: none;
        width: 100%;
        height: 100%;
    }


.round-results > .short-results {
    font-size: 18px;
    color: #34495e;
}

.round-results > .wide-results {
    clear: both;
    display: none;
}

    .round-results > .wide-results > div > .my, .round-results > .narrow-results > div > .my {
        float: left;
    }

    .round-results > .wide-results > div > .opponent, .round-results > .narrow-results > div > .opponent {
        float: right;
    }

@media(max-width:569px) {
    .round-results > .wide-results:not(.short) {
        display: block;
    }

    .round-results > .narrow-results:not(.short) {
        display: none;
    }
}

.round-results > .wide-results > div > .hint, .round-results > .narrow-results > div > .hint {
    width: 150px;
    margin: 0 auto;
    font-size: 16px;
    color: #c0c6ca;
}

    .round-results > .wide-results > div > .hint.left, .round-results > .narrow-results > div > .hint.left {
        margin-left: 0;
        text-align: left;
    }

.round-results > .narrow-results {
    width: 280px;
    margin: 0 auto;
}

    .round-results > .narrow-results.short {
        width: 190px;
        float: right;
    }

.round-results > div > .answers > .found {
    color: #2ecc71;
}

.round-results > div > .answers > .total {
    color: #2980b9;
}

.round-results > div > .score > .my {
    color: #e74c3c;
}

.round-results > div > .score > .opponent {
    color: #ed145b;
}

.round-results > div > .score > a {
    text-align: left;
    display: block;
    font-size: 12px;
    line-height: 15px;
    color: #34495e;
    text-decoration: underline;
    transition: all 0.1s ease;
}

    .round-results > div > .score > a:hover {
        text-decoration: none;
        color: #677686;
    }

.round-results > .answers-details > div {
    height: 57px;
}

    .round-results > .answers-details > div:not(:last-child) {
        border-bottom: 1px solid #c4c8c7;
    }

    .round-results > .answers-details > div > .word-answer {
        display: inline-block;
    }

        .round-results > .answers-details > div > .word-answer.my {
            margin-left: 5%;
        }

        .round-results > .answers-details > div > .word-answer.opponent {
            margin-right: 5%;
        }

    .round-results > .answers-details > div > .my {
        float: left;
        margin-top: 11px;
        width: 20%;
        text-align: center;
    }

    .round-results > .answers-details > div > .opponent {
        float: right;
        margin-top: 11px;
        width: 20%;
        text-align: center;
    }

    .round-results > .answers-details > div > .score:not(.found) {
        color: #95a5a6;
    }

    .round-results > .answers-details > div > .word-answer:not(.found) > span {
        border: 4px solid #95a5a6;
        background-color: transparent;
        color: #95a5a6;
    }

.game-results > .buttons {
    margin-top: 14px;
    clear: both;
}

    .game-results > .buttons > .button {
        width: 138px;
        white-space: nowrap;
    }

        .game-results > .buttons > .button.white, .game-results > .buttons > .button.green {
            border-width: 2px;
            border-style: solid;
        }

        .game-results > .buttons > .button.white {
            border-color: white;
        }

            .game-results > .buttons > .button.green, .game-results > .buttons > .button.white.hints {
                border-color: #2ecc71;
            }

                .game-results > .buttons > .button.white.hints.ru {
                    width: 170px;
                }

                .game-results > .buttons > .button.green:hover {
                    border-color: #186c3c;
                }

                .game-results > .buttons > .button.white.hints:not(:hover) {
                    color: #2c3e50;
                }

            .game-results > .buttons > .button.white, .game-results > .buttons > .button.white.hints {
                margin-right: 9px;
                position: relative;
            }

                .game-results > .buttons > .button.white.hints > span {
                    font-size: 13px;
                    position: absolute;
                    left: 0;
                    width: 100%;
                    line-height: 14px;
                }

                    .game-results > .buttons > .button.white.hints > span > .header {
                        font-size: 15px;
                    }

                    .game-results > .buttons > .button.white.hints > span > .highlight {
                        color: red;
                    }

@media(max-width:566px) {
    div.listview.auth-menu.left {
        border-bottom: none;
    }
}



div.listview.auth-menu > div > img.profile {
    margin: 3px 17px 3px 21px;
    width: 43px;
    height: 43px;
}

div.listview.auth-menu > .facebook {
    background-color: #3d5d95;
}

    div.listview.auth-menu > .facebook:hover > .header {
        color: #3d5d95;
    }

div.listview.auth-menu > .vkontakte {
    background-color: #155e8b;
}

    div.listview.auth-menu > .vkontakte:hover > .header {
        color: #155e8b;
    }

div.listview.auth-menu > .twitter {
    background-color: #00b0ed;
}

    div.listview.auth-menu > .twitter:hover > .header {
        color: #00b0ed;
    }

div.listview.auth-menu > .google {
	background-color: #c2d0da;
}

	div.listview.auth-menu > .google:hover > .header {
		color: #c2d0da;
	}

div.listview.auth-menu > .tfd {
    background-color: #238adb;
}

    div.listview.auth-menu > .tfd:hover > .header {
        color: #238adb;
    }

div.listview.auth-menu > div {
    background-repeat: no-repeat;
    background-position: 12px;
}

.vkontakte {
    background-image: url(../img/vk.png);
}

.facebook {
    background-image: url(../img/fb.png?r=2);
}

    .facebook.primary {
        -webkit-box-shadow: 0 0 4px #3b5998;
        -moz-box-shadow: 0 0 4px #3b5998;
        -ms-box-shadow: 0 0 4px #3b5998;
        -o-box-shadow: 0 0 4px #3b5998;
        box-shadow: 0 0 4px #3b5998;
    }

.ellipsis {
    background-image: url(../img/ellipsis.png?r=2);
}

.email {
    background-image: url(../img/email.png?r=2);
}

.locker {
    background-image: url(../img/locker.png);
}

.link {
    background-image: url(../img/link.png?r=2);
}

.twitter {
    background-image: url(../img/twitter.png?r=2);
}

.google {
    background-image: url(../img/google.png?r=4);
}

.wordhub {
    background-image: url(../img/wordhub.png?r=2);
}

.profile-time {
    background-image: url(../img/profile-time.png);
}

    .profile-time.not-clickable {
        background-image: url(../img/profile-time-bw.png);
    }

.profile-2head {
    background-image: url(../img/profile-2head.png);
}

.profile-1head {
    background-image: url(../img/profile-1head.png);
}

    .profile-1head.not-clickable {
        background-image: url(../img/profile-1head-bw.png);
    }

.tfd, .register-tfd {
    background-image: url(../img/tfd.png?r=2);
}

div.listview.auth-menu.main > div:first-child > div.header {
    padding-top: 14px;
    white-space: nowrap;
}

div.listview.auth-menu.main > div > div.header > .smaller {
    font-size: 14px;
    color: #808d8e;
}

div.listview.auth-menu.main > div:first-child > div.subheader {
    height: 31px;
}

div.listview.auth-menu.main > div > div.submenu {
    margin: 7px 20px;
}

div.listview.auth-menu.main > div > .subheader, div.listview.auth-menu.main {
    border-bottom: none;
}

.game-menu > .auth-sso-frame {
    height: 100%;
}

    .game-menu > .auth-sso-frame > iframe {
        border: none;
        width: 100%;
        height: 800px;
        min-height: 300px;
        max-height: calc(100% - 21px);
    }


.game-menu > .authentication {
    height: 100%;
}

    .game-menu > .authentication > .listview:not(.main):not(.borderless) {
        border-top: 1px solid #c4c8c7;
    }

    .game-menu > .authentication > .listview.auth-menu.main:not(.expanded) {
        height: 60px;
        overflow: hidden;
        transition: all 0.1s ease;
    }

    .game-menu > .authentication > .listview.auth-menu.main.expanded {
        overflow: hidden;
        outline: 0;
        height: 165px;
        transition: all 0.1s ease;
    }

@media (max-width:670px) {
    .game-menu > .authentication > .listview.auth-menu.main.expanded {
        height: 265px;
        transition: all 0.1s ease;
    }
}

.game-menu > .authentication > .listview.auth-menu.main.expanded > div:first-child:not(:active):hover {
    color: #34495e;
    background-color: white;
    background-color:rgba(255,255,255,.8);
}

div.listview.simple.auth-menu > .facebook > .header,
div.listview.simple.auth-menu > .vkontakte > .header,
div.listview.simple.auth-menu > .twitter > .header,
div.listview.simple.auth-menu > .google > .header,
div.listview.simple.auth-menu > .tfd > .header {
    color: white;
}

.listview.auth-menu.clickable.main > .supheader:hover, .listview.auth-menu.clickable.main > .social:hover,
.listview.auth-menu.clickable.main > .supheader:active, .listview.auth-menu.clickable.main > .social:active {
    background-color: white;
    background-color:rgba(255,255,255,.95);
    cursor: default;
}

.listview.auth-menu.main > .supheader:active > .header, .listview.auth-menu.main > .social:active > .header {
    color: #34495e;
}

.listview.auth-menu.main > .supheader:not(:first-child) > .header {
    margin-left: 67px;
    border-top: 1px solid #e5e7e9;
}

.authentication > .listview.auth-menu.main > .supheader:not(:first-child) > .header {
    border-top: none;
}

.listview.auth-menu.main > .supheader:first-child > .header {
    padding-top: 4px;
}

.listview.auth-menu.main > .half {
    width: 50%;
}

    .listview.auth-menu.main > .half.left {
        float: left;
    }

    .listview.auth-menu.main > .half.right {
        float: right;
    }

@media(min-width:671px) {
    .listview.auth-menu.main > .half.right.social:not(:nth-child(2)) {
        text-align: center;
        padding: 15px 5px 18px 15px;
    }
}

.listview.auth-menu.main > .half.right > .button.blue.tfd {
    float: none;
}

.button.blue.tfd {
    background-repeat: no-repeat;
    padding-left: 48px;
    height: 43px;
    margin: 0;
    background-color: #238adb;
    background-position: 1px 0;
    -ms-border-radius: 23px;
    -moz-border-radius: 23px;
    -webkit-border-radius: 23px;
    border-radius: 23px;
}

.listview.auth-menu.main > .half.right > div.button.blue.tfd:active {
    background-color: #238adb;
    /*color: #238adb;*/
}

.listview.auth-menu.main > .half.right > .or {
    float: left;
    font-size: 17px;
    cursor: default;
    display: inline-block;
    margin: 10px 5px 0 0;
    color: #34495e;
}

@media (max-width:670px) {
    .listview.auth-menu.main > .half {
        width: 100%;
    }

    .listview.auth-menu.main > .supheader.half.right {
        display: none;
    }
}


.listview.auth-menu.main > .social > a {
    width: 43px;
    height: 43px;
    display: inline-block;
    margin-right: 5px;
    cursor: pointer;
    -ms-border-radius: 24px;
    -moz-border-radius: 24px;
    -webkit-border-radius: 24px;
    border-radius: 24px;
    position: relative;
}

    .listview.auth-menu.main > .social > a:before {
        content: " ";
        position: absolute;
        top: 0;
        left: 0;
        width: 43px;
        height: 43px;
        background-color: white;
        opacity: 0.1;
        -ms-border-radius: 24px;
        -moz-border-radius: 24px;
        -webkit-border-radius: 24px;
        border-radius: 24px;
    }

    .listview.auth-menu.main > .social > a:hover:before {
        opacity: 0;
    }

    .listview.auth-menu.main > .social > a:active:before {
        opacity: 0.4;
    }

.listview.auth-menu.main > .social:not(:nth-child(2)):not(:nth-child(3)) {
    padding: 15px 5px 18px 67px;
}

.listview.auth-menu.main > .social:nth-child(2), .listview.auth-menu.main > .social:nth-child(3) {
    padding: 5px 5px 8px 20px;
    border-bottom: 1px solid #e5e7e9;
}

.listview.auth-menu.main > div:not(.social):not(.supheader):not(:last-child) {
    border-bottom: 1px solid #e5e7e9;
}

.listview.auth-menu.main > .social > div.button.blue.tfd {
    float: none;
}

div.listview.simple.auth-menu > .facebook > .header,
div.listview.simple.auth-menu > .vkontakte > .header,
div.listview.simple.auth-menu > .twitter > .header,
div.listview.simple.auth-menu > .google > .header,
div.listview.simple.auth-menu > .register-tfd > .header,
div.listview.simple.auth-menu > .tfd > .header,
div.listview.simple.auth-menu > .wordhub > .header,
div.listview.simple.auth-menu > .profile-2head > .header,
div.listview.simple.auth-menu > .profile-time > .header,
div.listview.simple.auth-menu > .profile-1head > .header {
    margin-left: 67px;
}

.notifications {
    color: white;
    position: fixed;
    width: 100%;
    -moz-min-width: 248px;
    -ms-min-width: 248px;
    -o-min-width: 248px;
    -webkit-min-width: 248px;
    min-width: 248px;
    height: 108px;
    left: 0;
    right: 0;
    top: 0;
    background-color: #556676;
    font-size: 17px;
    z-index: 5;
    -webkit-box-shadow: 4px 9px 9px #333;
    -moz-box-shadow: 4px 9px 9px #333;
    -ms-box-shadow: 4px 9px 9px #333;
    -o-box-shadow: 4px 9px 9px #333;
    box-shadow: 4px 9px 9px #333;
    -webkit-box-shadow: 4px 9px 9px rgba(70, 70, 70, 0.5);
    -moz-box-shadow: 4px 9px 9px rgba(70, 70, 70, 0.5);
    -ms-box-shadow: 4px 9px 9px rgba(70, 70, 70, 0.5);
    -o-box-shadow: 4px 9px 9px rgba(70, 70, 70, 0.5);
    box-shadow: 4px 9px 9px rgba(70, 70, 70, 0.5);
}

    .notifications.clickable {
        cursor: pointer;
    }

    .notifications .left {
        height: 76px;
    }

    .notifications td {
        text-align: right;
    }

    .notifications .left, .notifications .right {
        vertical-align: middle;
    }

        .notifications .left > img.profile {
            width: 76px;
            height: 76px;
            -ms-border-radius: 38px;
            -moz-border-radius: 38px;
            -webkit-border-radius: 38px;
            border-radius: 38px;
        }

    .notifications .buttons {
        padding-top: 9px;
        vertical-align: top;
        width: 400px;
        white-space: nowrap;
    }

    .notifications .text {
        vertical-align: bottom;
    }

    .notifications .buttons > .share-and-details, .notifications .buttons > .share-and-details > .facebook, .notifications .buttons > .share-and-details > .vkontakte, .notifications .buttons > .share-and-details > .twitter {
        display: inline-block;
        vertical-align: middle;
    }

        .notifications .buttons > .share-and-details > .facebook, .notifications .buttons > .share-and-details > .vkontakte, .notifications .buttons > .share-and-details > .twitter {
            width: 29px;
            height: 29px;
            margin-right: 4px;
        }

        .notifications .buttons > .share-and-details > .facebook {
            background-image: url(../img/fb.32x32.png?r=2);
        }

        .notifications .buttons > .share-and-details > .vkontakte {
            background-image: url(../img/vk.32x32.png?r=2);
        }

        .notifications .buttons > .share-and-details > .twitter {
            background-image: url(../img/twitter.32x32.png?r=2);
        }

    .notifications .buttons > .button:not(.with-icon) {
        height: 29px;
        line-height: 27px;
        display: inline-block;
        padding: 0 14px;
        -ms-border-radius: 14px;
        -moz-border-radius: 14px;
        -webkit-border-radius: 14px;
        border-radius: 14px;
        font-size: 17px;
        width: 108px;
        text-align: center;
    }

    .notifications .right > .button-close {
        float: right;
        margin: 0 32px 0 9px;
        -ms-border-radius: 38px;
        -moz-border-radius: 38px;
        -webkit-border-radius: 38px;
        border-radius: 38px;
        background-color: #ff3b30;
    }

.challenge-timer {
    width: 57px;
    height: 57px;
    float: left;
}

.challenge-profile {
    position: relative;
    margin-left: 5px;
}


    .challenge-profile > img.smaller-profile {
        width: 51px;
        height: 51px;
        -webkit-border-radius: 25px;
        -moz-border-radius: 25px;
        -ms-border-radius: 25px;
        -o-border-radius: 25px;
        border-radius: 25px;
        position: absolute;
        display: block;
        left: 3px;
        top: 3px;
        z-index: 1;
    }

.store {
    margin: 22px auto 0;
    margin-left: calc(50% - 201px);
    font-size: 15px;
    text-align: justify;
    width: 401px;
    padding: 0 14px 0 14px;
    color: #777777;
}

    .store > select {
        width: 100%;
    }

div.store > .selector > .option {
    width: calc(50% - 1px);
    text-align: center;
}

.store > .headblock {
    padding: 10px 0;
}

.store > ul {
    margin: 0;
}

.store .title {
    font-size: 22px;
    font-weight: bold;
    color: #334553;
}

.store > .right-to-profile {
    margin-left: 110px;
}

.store .title > .price, .store .button > .price, .level-packs .button > .price {
    float: right;
}

img.coin {
    width: 28px;
    height: 28px;
    margin: -5px 0 0 1px;
}

.store img.coin {
    width: 24px;
    height: 24px;
    margin: -3px 0 0 1px;
}

.store > img.profile {
    float: left;
    margin: 0 10px 5px 0;
    border-radius: 50%;
    width: 100px;
}

.store > .check-box {
    float: right;
    cursor: pointer;
    margin-left: 10px;
}

.store > .button {
    width: 300px;
    height: 46px;
    display: block;
    clear: both;
    margin: 5px auto;
    padding: 7px 10px;
}

    .store > .button.with-descr {
        width: 400px;
    }

    .store > .button.white {
        border: 1px solid #c4c8c7;
        color: #2C3E50;
        font-size: 22px;
        line-height: 21px;
        text-align: center;
    }

    .store > .button.coins-1 {
        padding-top: 12px;
    }

        .store > .button.coins-1 > img {
            margin: -5px 5px 0 0;
        }

    .store > .button.coins-2 {
        padding-top: 11px;
    }

        .store > .button.coins-2 > img {
            margin: -6px 5px 0 0;
        }

        .store > .button.coins-2 > .price {
            margin-top: 1px;
        }

    .store > .button.coins-3 {
        padding-top: 2px;
    }

        .store > .button.coins-3 > img {
            margin: -2px 5px 0 0;
            vertical-align: top;
        }

        .store > .button.coins-3 > .price, .store > .button.with-descr.coins-3 > .qty {
            margin-top: 8px;
        }

        .store > .button.coins-3 > .highlight {
            font-size: 12px;
            color: #E74C3C;
            display: block;
            float: left;
        }

    .store > .button > img {
        width: 32px;
        margin-right: 5px;
        float: left;
    }

    .store > .button > .qty {
        float: left;
    }

    .store > .button > .descr {
        display: none;
    }

    .store > .button.with-descr > .descr {
        display: inline;
    }

    .store > .button.with-descr.coins-3 > .highlight {
        float: none;
    }

.store > div > .hyperlink {
    margin-top: 5px;
}

    .store > div > .hyperlink > .popup > hr {
        margin: 15px 0;
    }

.store > .coins-stack {
    float: left;
    margin: -27px 11px 0;
    text-align: center;
    cursor: pointer;
}

    .store > .coins-stack > img {
        width: 101px;
    }

    .store > .coins-stack:hover > img {
        opacity: 0.8;
    }

    .store > .coins-stack > .qty-1, .store > .coins-stack > .qty-2, .store > .coins-stack > .qty-3 {
        font-size: 22px;
        margin-bottom: 3px;
    }

    .store > .coins-stack > .qty-1 {
        margin-top: 47px;
    }

    .store > .coins-stack > .qty-2 {
        margin-top: 29px;
    }

    .store > .coins-stack > .price {
        font-size: 18px;
        color: #808d8e;
        text-align: center;
        margin-top: 10px;
    }

    .store > .coins-stack:hover > .price, .store > .coins-stack:hover > .qty-1, .store > .coins-stack:hover > .qty-2, .store > .coins-stack:hover > .qty-3 {
        color: #efa92e;
    }

    .store > .coins-stack > .highlight {
        font-size: 12px;
        margin-top: -4px;
        color: #efa92e;
    }

.store > div > .hyperlink > .popup {
    background-color: white;
    text-align: left;
    border-radius: 20px;
    padding: 20px;
    width: 400px;
    left: calc(50% - 200px);
    cursor: default;
    top: 40px;
}

    .store > div > .hyperlink > .popup:not(.looking-up)::before {
        left: 185px;
    }

    .store > div > .hyperlink > .popup > .alt-button {
        float: right;
    }

.game-menu > .credits {
    margin: 22px auto 0 auto;
    font-size: 15px;
    text-align: justify;
    padding: 0 14px 0 14px;
    color: #777777;
}

.credits h1 {
    color: #3498db;
    margin-top: 5px;
    margin-bottom: 5px;
}

.credits h2 {
    color: #8dc63f;
    margin-top: 5px;
    margin-bottom: 5px;
}

.credits h3 {
    color: #9b59b6;
    margin-top: 5px;
    margin-bottom: 5px;
}

.credits .footnote {
    font-size: 14px;
}

.credits .emphasize {
    color: #ed145b;
    font-weight: bold;
}

.credits {
    text-align: left;
}

    .credits > div {
        margin-bottom: 18px;
        color: #334553;
    }


.button-buy {
    border: none;
    display: inline-block;
    line-height: 63px;
    background: url(../img/buy.png?r=2) no-repeat;
    width: 89px;
    height: 59px;
    cursor: pointer;
}

.overlay > .loading .store .button-free {
    position: relative;
    margin: 0;
    padding: 7px 20px;
    font-size: 20px;
    font-weight: normal;
}

.listview.simple.with-subheader > div > .subheader {
    line-height: 20px;
    font-weight: bold;
    font-size: 14px;
    color: rgb(52, 152, 219);
}

.button.button-free > .popup {
    width: 300px;
    left: calc(50% - 150px);
}

    .button.button-free > .popup.looking-up::before {
        left: 155px;
    }

.banner-728x90 {
    width: 655px;
    height: 81px;
    border: none;
    overflow: hidden;
    margin: 0 auto;
    display: block;
}

@media (max-width:655px) {
    .banner-728x90 {
        width: 100%;
    }
}

div.listview.clickable > div.random > .button.green {
    -webkit-animation: green-blink 1s infinite normal linear;
    -moz-animation: green-blink 1s infinite normal linear;
    -ms-animation: green-blink 1s infinite normal linear;
    -o-animation: green-blink 1s infinite normal linear;
    animation: green-blink 1s infinite normal linear;
}

    div.listview.clickable > div.random > .button.green:hover {
        -webkit-animation: none;
        -moz-animation: none;
        -ms-animation: none;
        -o-animation: none;
        animation: none;
    }

@-webkit-keyframes green-blink {
    0% {
        background-color: #2ecc71;
    }

    50% {
        background-color: #186c3c;
    }

    100% {
        background-color: #2ecc71;
    }
}

@-moz-keyframes green-blink {
    0% {
        background-color: #2ecc71;
    }

    50% {
        background-color: #186c3c;
    }

    100% {
        background-color: #2ecc71;
    }
}

@-ms-keyframes green-blink {
    0% {
        background-color: #2ecc71;
    }

    50% {
        background-color: #186c3c;
    }

    100% {
        background-color: #2ecc71;
    }
}

@-o-keyframes green-blink {
    0% {
        background-color: #2ecc71;
    }

    50% {
        background-color: #186c3c;
    }

    100% {
        background-color: #2ecc71;
    }
}

@keyframes green-blink {
    0% {
        background-color: #2ecc71;
    }

    50% {
        background-color: #186c3c;
    }

    100% {
        background-color: #2ecc71;
    }
}

.new-game-social > .new-game > .listview.half > div > .submenu {
    margin: 7px 2px;
}

.new-game-social > .new-game.friends > .listview > div > .header {
    overflow: hidden;
}

.new-game-social > .new-game.friends > .listview {
    border-top: none;
}

.new-game-social>.new-game{
    margin-left:1px;
    margin-right:1px;
}

.new-game-social > .new-game.friends {
    max-height: calc(100% - 362px);
    min-height: 58px;
    overflow: auto;
}

.new-game-social {
    height: calc(100% - 31px);
}

    .new-game-social > .new-game.friends::-webkit-scrollbar-button {
        display: none;
    }

@media(min-width:722px) {
    .new-game-social > .new-game.friends {
        max-height: calc(100% - 232px);
    }

    .new-game-social > div.new-game > div.spacer {
        display: none;
    }

    .listview.half {
        width: 50%;
    }

        .listview.half.left {
            float: left;
            border-right: 1px solid #e5e7e9;
        }

        .listview.half.right {
            float: right;
        }

    div.listview.half > div > div.subheader {
        border-bottom: none;
    }

    .listview.half > div:not(:last-child) {
        border-bottom: 1px solid #c4c8c7;
    }
}

.toolbox > .content > .alt-button {
    float: left;
}

.alt-button:not(.ellipsis) {
}

.alt-button {
    cursor: pointer;
    width: 43px;
    height: 43px;
    display: inline-block;
    -ms-border-radius: 22px;
    -moz-border-radius: 22px;
    -webkit-border-radius: 22px;
    border-radius: 22px;
    -webkit-box-shadow: 4px 4px 0 #95a5a6;
    -moz-box-shadow: 4px 4px 0 #95a5a6;
    -ms-box-shadow: 4px 4px 0 #95a5a6;
    -o-box-shadow: 4px 4px 0 #95a5a6;
    box-shadow: 4px 4px 0 #95a5a6;
    margin: 0 12px 4px 0;
}

    .alt-button.facebook {
        background-color: #3b5998;
    }

    .alt-button.vkontakte {
        background-color: #155e8b;
    }

	.alt-button.google {
		background-color: #c2d0da;
	}

    .alt-button.twitter {
        background-color: #00b0ed;
    }

    .alt-button.ellipsis {
        background-color: #8dc63f;
    }

    .alt-button.email {
        background-color: #f1c40f;
    }

    .alt-button.link {
        background-color: #1abc9c;
    }

.how-to-play .facebook, .how-to-play .vkontakte, .how-to-play .google, .how-to-play .twitter, .how-to-play .link, .how-to-play .email {
    display: inline-block;
    width: 42px;
    height: 42px;
    zoom: 0.6;
    -moz-transform: scale(0.6);
    line-height: 50px;
}

.new-game-social > .toolbar > .toolbox > .content {
}
/*.alt-button.selected {
	box-shadow: 4px 4px 9px #2ecc71;
}*/

.alt-button:active:not(.disabled), .alt-button.pushed:not(.disabled) {
    box-shadow: none;
    margin: 4px 8px 0 4px;
    outline: 0;
}

.alt-button.ellipsis {
    position: relative;
}

    .alt-button.ellipsis > .popup {
        padding: 11px 0 15px 15px;
        position: absolute;
        z-index: 2;
        top: 48px;
        left: -15px;
        display: none;
        height: 67px;
        overflow: hidden;
        width: 142px;
        background-color: white;
        -ms-border-radius: 5px;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        border-radius: 5px;
        border: 1px solid #fefefe;
    }


    .alt-button.ellipsis.pushed > .popup {
        display: block;
        -webkit-animation: poopup-expand 0.1s 1 normal linear;
        -moz-animation: poopup-expand 0.1s 1 normal linear;
        -ms-animation: poopup-expand 0.1s 1 normal linear;
        -o-animation: poopup-expand 0.1s 1 normal linear;
        animation: poopup-expand 0.1s 1 normal linear;
    }

@-webkit-keyframes poopup-expand {
    from {
        height: 0;
    }

    to {
        height: 57px;
    }
}

@-moz-keyframes poopup-expand {
    from {
        height: 0;
    }

    to {
        height: 57px;
    }
}

@-ms-keyframes poopup-expand {
    from {
        height: 0;
    }

    to {
        height: 57px;
    }
}

@-o-keyframes poopup-expand {
    from {
        height: 0;
    }

    to {
        height: 57px;
    }
}

@keyframes poopup-expand {
    from {
        height: 0;
    }

    to {
        height: 57px;
    }
}

.alt-button.disabled {
    position: relative;
    cursor: default;
}

    .alt-button.disabled::after {
        position: absolute;
        width: 52px;
        height: 52px;
        top: 0;
        left: 0;
        background-color: white;
        opacity: 0.8;
        content: " ";
    }

.new-game-social > .toolbar {
    font-size: 17px;
}

    .new-game-social > .toolbar > .toolbox > .caption {
        color: #34495e;
        padding: 0 18px;
    }

    .new-game-social > .toolbar > .toolbox {
        background-color: white;
        background-color: rgba(255,255,255,.7);
        float: left;
        text-align: left;
        -ms-border-top-left-radius: 14px;
        -moz-border-top-left-radius: 14px;
        -webkit-border-top-left-radius: 14px;
        border-top-left-radius: 14px;
        -ms-border-top-right-radius: 14px;
        -moz-border-top-right-radius: 14px;
        -webkit-border-top-right-radius: 14px;
        border-top-right-radius: 14px;
        position: relative;
        margin-left:1px;
    }

    div.clear-both{
        clear:both;
        height:0;
    }

        .new-game-social > .toolbar > .toolbox:after {
            content: '';
            width: 19px;
            height: 18px;
            border: none;
            position: absolute;
            bottom: 0;
            border-top: 0;
            border-right: 0;
            -ms-border-radius: 0 0 0 14px;
            -moz-border-radius: 0 0 0 14px;
            -webkit-border-radius: 0 0 0 14px;
            border-radius: 0 0 0 14px;
            right: -19px;
            box-shadow: 0px 1px 0px rgba(80, 80, 80, 0.23), -4px 4px 0 white;
            
        }

        .new-game-social > .toolbar > .toolbox > .content {
            padding: 0 9px 0 18px;
            margin: 14px 0 14px 0;
            height: 48px;
        }

    .new-game-social > .toolbar > .button, .new-game-social > .toolbar > input {
        float: right;
    }

    .new-game-social > .toolbar > .button {
        padding: 3px 18px;
        margin-left: 9px;
        font-size: 16px;
        margin-right: 9px;
    }

    .new-game-social > .toolbar > input {
        padding: 0 9px;
        width: 225px;
    }

@media (max-width:599px) {
    .new-game-social > .toolbar > input {
        width: 180px;
    }
}

.new-game-social > .toolbar > input::-webkit-input-placeholder {
    padding-top: 2px;
    font-size: 16px;
    text-align: center;
    color: #95a5a6;
}

.new-game-social > .toolbar > input:-moz-placeholder {
    padding-top: 2px;
    font-size: 16px;
    text-align: center;
    color: #95a5a6;
}

.new-game-social > .toolbar > input:-ms-input-placeholder {
    padding-top: 2px;
    font-size: 16px;
    text-align: center;
    color: #95a5a6;
}

.new-game-social > .toolbar > .button.alt {
    display: none;
    float: right;
    margin-top: 9px;
    margin-right: 7px;
}

@media (max-width:553px) {
    .new-game-social > .toolbar {
        text-align: right;
    }

        .new-game-social > .toolbar > input {
            width: 180px;
            float: none;
        }

        .new-game-social > .toolbar > .button {
            display: none;
        }

            .new-game-social > .toolbar > .button.alt {
                display: inline-block;
            }
}

@media (max-width:449px) {
    .new-game-social > .toolbar > input {
        width: 105px;
    }
}

.new-game-social > .toolbar > .spacer {
    clear: both;
    height: 0;
}

.spacer {
    height: 18px;
}

.facebook-24 {
    background: url(../img/fb.24x24.png?r=2) no-repeat;
    width: 22px;
    height: 22px;
}

.vkontakte-24 {
    background: url(../img/vk.24x24.png?r=2) no-repeat;
    width: 22px;
    height: 22px;
}

.google-24 {
    background: url(../img/google.24x24.png?r=2) no-repeat;
    width: 22px;
    height: 22px;
}

.wordhub-logo-20 {
    background: url(../img/wordhub-20.png?r=2) no-repeat;
    width: 18px;
    height: 18px;
}

.new-game.friends > .listview > div, .games-list > div > .listview > div {
    position: relative;
}

    .new-game.friends > .listview > div > .facebook-24, .games-list > div > .listview > div > .facebook-24,
    .new-game.friends > .listview > div > .vkontakte-24, .games-list > div > .listview > div > .vkontakte-24,
    .new-game.friends > .listview > div > .google-24, .games-list > div > .listview > div > .google-24 {
        position: absolute;
        display: inline-block;
        bottom: 0;
        left: 40px;
        z-index: 2;
    }

    .new-game.friends > .listview > div > .wordhub-logo-20, .challenges.social > .listview > div > .wordhub-logo-20 {
        position: absolute;
        display: inline-block;
        bottom: 12px;
        left: 67px;
        z-index: 2;
    }

    .new-game.friends > .listview > div > .subheader.with-logo, .challenges.social > .listview > div > .subheader.with-logo {
        padding-left: 20px;
    }

.selector {
    -ms-border-radius: 14px;
    -moz-border-radius: 14px;
    -webkit-border-radius: 14px;
    border-radius: 14px;
    /*border: 1px solid ActiveBorder;*/
}


    .selector > .option {
        padding: 5px 15px;
        width: calc(25% - 1px);
        display: inline-block;
        color: CaptionText;
    }

        .selector > .option:first-child {
            -ms-border-top-left-radius: 14px;
            -moz-border-top-left-radius: 14px;
            -webkit-border-top-left-radius: 14px;
            border-top-left-radius: 14px;
            -ms-border-bottom-left-radius: 14px;
            -moz-border-bottom-left-radius: 14px;
            -webkit-border-bottom-left-radius: 14px;
            border-bottom-left-radius: 14px;
        }

        .selector > .option:last-child {
            -ms-border-top-right-radius: 14px;
            -moz-border-top-right-radius: 14px;
            -webkit-border-top-right-radius: 14px;
            border-top-right-radius: 14px;
            -ms-border-bottom-right-radius: 14px;
            -moz-border-bottom-right-radius: 14px;
            -webkit-border-bottom-right-radius: 14px;
            border-bottom-right-radius: 14px;
        }

    .selector > .hor-spacer {
        display: inline-block;
        padding: 6px 0;
        width: 1px;
        background-color: ActiveBorder;
    }

    .selector > .ver-spacer {
        display: block;
        height: 1px;
        background-color: ActiveBorder;
    }

    .selector > .option.selected {
        color: Highlight;
        background-color: ActiveBorder;
    }

    .selector.blue {
    }

        .selector.blue > .option {
            width: 30%;
            border: 1px solid #3498db;
            background-color: white;
            color: #3498db;
        }

            .selector.blue > .option:hover:not(.selected) {
                background-color: #3468ab;
                color: white;
            }

            .selector.blue > .option.selected {
                background-color: #3498db;
                color: white;
            }

    .selector.dark-blue {
        /*border: 1px solid white;*/
    }

        .selector.dark-blue > .hor-spacer {
            background: white;
        }

        .selector.dark-blue > .option {
            padding: 15px 0;
            color: #34495e;
            height: 58px;
            min-width: 135px;
        }

            .selector.dark-blue > .option:hover:not(.selected) {
                background-color: #455a6f;
                color: white;
            }

            .selector.dark-blue > .option.selected {
                background-color: white;
                color: #34495e;
            }

    .selector.blue > .hor-spacer, .selector.blue > .ver-spacer {
        background: #3498db;
    }

    .selector.dark-blue > .hor-spacer, .selector.dark-blue > .ver-spacer {
        background: white;
    }

    .selector.dark-blue > .hor-spacer {
        padding: 14px 0 20px;
    }

    .selector.dark-blue > .option:first-child {
        -ms-border-bottom-left-radius: 0;
        -moz-border-bottom-left-radius: 0;
        -webkit-border-bottom-left-radius: 0;
        border-bottom-left-radius: 0;
    }

    .selector.dark-blue > .option:last-child {
        -ms-border-bottom-right-radius: 0;
        -moz-border-bottom-right-radius: 0;
        -webkit-border-bottom-right-radius: 0;
        border-bottom-right-radius: 0;
    }


    .selector > .option:hover:not(.selected) {
        cursor: pointer;
    }

a.play-store-logo {
    text-decoration: none;
}

div.hyperlink {
    transition: all 0.3s linear;
    font-size: 16px;
    cursor: pointer;
    display: inline-block;
    position: relative;
}

    div.hyperlink:hover {
        text-decoration: underline;
    }

    div.hyperlink.gray, div.hyperlink.gray-red {
        color: #95a5a6;
    }

        div.hyperlink.gray:hover {
            color: #c0c0c0;
        }

        div.hyperlink.gray-red:hover {
            color: #E74C3C;
        }

    div.hyperlink.light-blue {
        color: #8ED8FF;
    }

        div.hyperlink.light-blue:hover {
            color: #cddee8;
            text-shadow: 0 0 4px black;
        }

.loading-line {
    width: 470px;
    height: 40px;
}

    .loading-line.floating {
        z-index: 100;
        position: fixed;
        left: calc(50% - 235px);
        top: 37px;
    }

.cup {
    width: 32px;
    height: 32px;
    background-repeat: no-repeat;
    display: inline-block;
}

    .cup.gold {
        background-image: url(../img/cup-gold.png);
    }

    .cup.silver {
        background-image: url(../img/cup-silver.png);
    }

    .cup.bronze {
        background-image: url(../img/cup-bronze.png);
    }

.game-menu > .welcome > .w {
    color: rgb(52, 152, 219);
}

.game-menu > .welcome > .o {
    color: rgb(243, 156, 18);
}

.game-menu > .welcome > .r {
    color: rgb(141, 198, 63);
}

.game-menu > .welcome > .d {
    color: rgb(237, 20, 91);
}

.game-menu > .welcome > .h {
    color: rgb(241, 196, 15);
}

.game-menu > .welcome > .u {
    color: rgb(26, 188, 156);
}

.game-menu > .welcome > .b {
    color: rgb(155, 89, 182);
}

.game-menu > .welcome {
    font-size: 32px;
    color: #2c3e50;
}

.game-menu > .skip-tutorial {
    font-size: 16px;
    color: #888888;
    margin: 20px 0 0;
}

    .game-menu > .skip-tutorial > .rules {
        font-size: 21px;
        color: #2c3e50;
        margin-bottom: 10px;
    }

    .game-menu > .skip-tutorial > .button {
        margin: 10px;
        padding: 3px 14px;
        font-size: 16px;
        position: relative;
    }


.button.gray.pushed {
    background-color: #556676;
}

.hyperlink.gray.pushed {
    color: #c0c0c0;
    text-decoration: underline;
}

.gameplay > .tutorial-instruction {
    font-size: 18px;
    color: #2c3e50;
}

@media(max-height:590px) {
    div.game.tutorial {
        height: calc(100% - 175px);
    }
}

.opacity-display-show {
    transition: opacity 0.1s linear;
    opacity: 1;
}

.opacity-display-hide {
    transition: opacity 0.1s linear;
    opacity: 0;
    z-index: -100 !important;
}

.floating-message {
    background: rgba(0, 0, 0, 0.54);
    color: white;
    font-size: 14px;
    padding: 10px;
    width: 140px;
    position: absolute;
    -ms-border-radius: 20px;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    border-radius: 20px;
    z-index: 6;
}

.challenge > .banner {
    background-color: #2c3e50;
    text-align: right;
    height: 116px;
    padding: 24px;
    white-space: nowrap;
    font-size: 16px;
    color: white;
}

    .challenge > .banner > img.avatar {
        width: 68px;
        height: 68px;
        -ms-border-radius: 34px;
        -moz-border-radius: 34px;
        -webkit-border-radius: 34px;
        border-radius: 34px;
        float: left;
        margin-right: 12px;
    }

    .challenge > .banner > .button {
        margin: 12px 0 0 12px;
        text-align: center;
        position: relative;
    }

.button.green.pushed {
    background-color: #186c3c;
}

.banner > span > .hyperlink {
    margin: 20px 12px 0 0;
}

.challenge > .banner > .greeting {
    font-size: 18px;
    float: left;
    max-width: 50%;
    text-align: left;
}

    .challenge > .banner > .greeting > .name {
        display: inline-block;
        overflow: hidden;
        width: 100%;
        white-space: normal;
        height: 28px;
    }

.challenge > .round-results {
    padding: 0;
}

.text-centered {
    text-align: center;
}


.bookman-dance {
    background-repeat: no-repeat;
    background-image: url(../img/bookman-frames.png);
    -webkit-animation-name: bookman-dance;
    -moz-animation-name: bookman-dance;
    -ms-animation-name: bookman-dance;
    -o-animation-name: bookman-dance;
    animation-name: bookman-dance;
    -webkit-animation-duration: 6s;
    -moz-animation-duration: 6s;
    -ms-animation-duration: 6s;
    -o-animation-duration: 6s;
    animation-duration: 6s;
    -webkit-animation-iteration-count: 1;
    -moz-animation-iteration-count: 1;
    -ms-animation-iteration-count: 1;
    -o-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-animation-timing-function: steps(1,end);
    -moz-animation-timing-function: steps(1,end);
    -ms-animation-timing-function: steps(1,end);
    -o-animation-timing-function: steps(1,end);
    animation-timing-function: steps(1,end);
    width: 250px;
    height: 250px;
}

@-webkit-keyframes bookman-dance {
    0% {
        background-position: -0 -0;
    }

    .5% {
        background-position: -250px -0;
    }

    1% {
        background-position: -500px -0;
    }

    1.5% {
        background-position: -750px -0;
    }

    2% {
        background-position: -1000px -0;
    }

    2.5% {
        background-position: -1250px -0;
    }

    3% {
        background-position: -1500px -0;
    }

    3.5% {
        background-position: -1750px -0;
    }

    4% {
        background-position: -2000px -0;
    }

    4.5% {
        background-position: -2250px -0;
    }

    5% {
        background-position: -2500px -0;
    }

    5.5% {
        background-position: -2750px -0;
    }

    6% {
        background-position: -3000px -0;
    }

    6.5% {
        background-position: -3250px -0;
    }

    7% {
        background-position: -3500px -0;
    }

    7.5% {
        background-position: -3750px -0;
    }

    8% {
        background-position: -4000px -0;
    }

    8.5% {
        background-position: -4250px -0;
    }

    9% {
        background-position: -4500px -0;
    }

    9.5% {
        background-position: -4750px -0;
    }

    10% {
        background-position: -5000px -0;
    }

    10.5% {
        background-position: -5250px -0;
    }

    11% {
        background-position: -5500px -0;
    }

    11.5% {
        background-position: -5750px -0;
    }

    12% {
        background-position: -6000px -0;
    }

    12.5% {
        background-position: -6250px -0;
    }

    13% {
        background-position: -6500px -0;
    }

    13.5% {
        background-position: -6750px -0;
    }

    14% {
        background-position: -7000px -0;
    }

    14.5% {
        background-position: -7250px -0;
    }

    15% {
        background-position: -7500px -0;
    }

    15.5% {
        background-position: -7750px -0;
    }

    16% {
        background-position: -8000px -0;
    }

    16.5% {
        background-position: -8250px -0;
    }

    17% {
        background-position: -8500px -0;
    }

    17.5% {
        background-position: -8750px -0;
    }

    18% {
        background-position: -9000px -0;
    }

    18.5% {
        background-position: -9250px -0;
    }

    19% {
        background-position: -9500px -0;
    }

    19.5% {
        background-position: -9750px -0;
    }

    20% {
        background-position: -10000px -0;
    }

    20.5% {
        background-position: -10250px -0;
    }

    21% {
        background-position: -10500px -0;
    }

    21.5% {
        background-position: -10750px -0;
    }

    22% {
        background-position: -11000px -0;
    }

    22.5% {
        background-position: -11250px -0;
    }

    23% {
        background-position: -11500px -0;
    }

    23.5% {
        background-position: -11750px -0;
    }

    24% {
        background-position: -12000px -0;
    }

    24.5% {
        background-position: -12250px -0;
    }

    25% {
        background-position: -12500px -0;
    }

    25.5% {
        background-position: -12750px -0;
    }

    26% {
        background-position: -13000px -0;
    }

    26.5% {
        background-position: -13250px -0;
    }

    27% {
        background-position: -13500px -0;
    }

    27.5% {
        background-position: -13750px -0;
    }

    28% {
        background-position: -14000px -0;
    }

    28.5% {
        background-position: -14250px -0;
    }

    29% {
        background-position: -14500px -0;
    }

    29.5% {
        background-position: -14750px -0;
    }

    30% {
        background-position: -15000px -0;
    }

    30.5% {
        background-position: -15250px -0;
    }

    31% {
        background-position: -15500px -0;
    }

    31.5% {
        background-position: -15750px -0;
    }

    32% {
        background-position: -16000px -0;
    }

    32.5% {
        background-position: -16250px -0;
    }

    33% {
        background-position: -16500px -0;
    }

    33.5% {
        background-position: -16750px -0;
    }

    34% {
        background-position: -17000px -0;
    }

    34.5% {
        background-position: -17250px -0;
    }

    35% {
        background-position: -17500px -0;
    }

    35.5% {
        background-position: -17750px -0;
    }

    36% {
        background-position: -18000px -0;
    }

    36.5% {
        background-position: -18250px -0;
    }

    37% {
        background-position: -18500px -0;
    }

    37.5% {
        background-position: -18750px -0;
    }

    38% {
        background-position: -19000px -0;
    }

    38.5% {
        background-position: -19250px -0;
    }

    39% {
        background-position: -19500px -0;
    }

    39.5% {
        background-position: -19750px -0;
    }

    40% {
        background-position: -20000px -0;
    }

    40.5% {
        background-position: -20250px -0;
    }

    41% {
        background-position: -20500px -0;
    }

    41.5% {
        background-position: -20750px -0;
    }

    42% {
        background-position: -21000px -0;
    }

    42.5% {
        background-position: -21250px -0;
    }

    43% {
        background-position: -21500px -0;
    }

    43.5% {
        background-position: -21750px -0;
    }

    44% {
        background-position: -22000px -0;
    }

    44.5% {
        background-position: -22250px -0;
    }

    45% {
        background-position: -22500px -0;
    }

    45.5% {
        background-position: -22750px -0;
    }

    46% {
        background-position: -23000px -0;
    }

    46.5% {
        background-position: -23250px -0;
    }

    47% {
        background-position: -23500px -0;
    }

    47.5% {
        background-position: -23750px -0;
    }

    48% {
        background-position: -24000px -0;
    }

    48.5% {
        background-position: -24250px -0;
    }

    49% {
        background-position: -24500px -0;
    }

    49.5% {
        background-position: -24750px -0;
    }

    50% {
        background-position: -25000px -0;
    }

    50.5% {
        background-position: -250px -250px;
    }

    51% {
        background-position: -500px -250px;
    }

    51.5% {
        background-position: -750px -250px;
    }

    52% {
        background-position: -1000px -250px;
    }

    52.5% {
        background-position: -1250px -250px;
    }

    53% {
        background-position: -1500px -250px;
    }

    53.5% {
        background-position: -1750px -250px;
    }

    54% {
        background-position: -2000px -250px;
    }

    54.5% {
        background-position: -2250px -250px;
    }

    55% {
        background-position: -2500px -250px;
    }

    55.5% {
        background-position: -2750px -250px;
    }

    56% {
        background-position: -3000px -250px;
    }

    56.5% {
        background-position: -3250px -250px;
    }

    57% {
        background-position: -3500px -250px;
    }

    57.5% {
        background-position: -3750px -250px;
    }

    58% {
        background-position: -4000px -250px;
    }

    58.5% {
        background-position: -4250px -250px;
    }

    59% {
        background-position: -4500px -250px;
    }

    59.5% {
        background-position: -4750px -250px;
    }

    60% {
        background-position: -5000px -250px;
    }

    60.5% {
        background-position: -5250px -250px;
    }

    61% {
        background-position: -5500px -250px;
    }

    61.5% {
        background-position: -5750px -250px;
    }

    62% {
        background-position: -6000px -250px;
    }

    62.5% {
        background-position: -6250px -250px;
    }

    63% {
        background-position: -6500px -250px;
    }

    63.5% {
        background-position: -6750px -250px;
    }

    64% {
        background-position: -7000px -250px;
    }

    64.5% {
        background-position: -7250px -250px;
    }

    65% {
        background-position: -7500px -250px;
    }

    65.5% {
        background-position: -7750px -250px;
    }

    66% {
        background-position: -8000px -250px;
    }

    66.5% {
        background-position: -8250px -250px;
    }

    67% {
        background-position: -8500px -250px;
    }

    67.5% {
        background-position: -8750px -250px;
    }

    68% {
        background-position: -9000px -250px;
    }

    68.5% {
        background-position: -9250px -250px;
    }

    69% {
        background-position: -9500px -250px;
    }

    69.5% {
        background-position: -9750px -250px;
    }

    70% {
        background-position: -10000px -250px;
    }

    70.5% {
        background-position: -10250px -250px;
    }

    71% {
        background-position: -10500px -250px;
    }

    71.5% {
        background-position: -10750px -250px;
    }

    72% {
        background-position: -11000px -250px;
    }

    72.5% {
        background-position: -11250px -250px;
    }

    73% {
        background-position: -11500px -250px;
    }

    73.5% {
        background-position: -11750px -250px;
    }

    74% {
        background-position: -12000px -250px;
    }

    74.5% {
        background-position: -12250px -250px;
    }

    75% {
        background-position: -12500px -250px;
    }

    75.5% {
        background-position: -12750px -250px;
    }

    76% {
        background-position: -13000px -250px;
    }

    76.5% {
        background-position: -13250px -250px;
    }

    77% {
        background-position: -13500px -250px;
    }

    77.5% {
        background-position: -13750px -250px;
    }

    78% {
        background-position: -14000px -250px;
    }

    78.5% {
        background-position: -14250px -250px;
    }

    79% {
        background-position: -14500px -250px;
    }

    79.5% {
        background-position: -14750px -250px;
    }

    80% {
        background-position: -15000px -250px;
    }

    80.5% {
        background-position: -15250px -250px;
    }

    81% {
        background-position: -15500px -250px;
    }

    81.5% {
        background-position: -15750px -250px;
    }

    82% {
        background-position: -16000px -250px;
    }

    82.5% {
        background-position: -16250px -250px;
    }

    83% {
        background-position: -16500px -250px;
    }

    83.5% {
        background-position: -16750px -250px;
    }

    84% {
        background-position: -17000px -250px;
    }

    84.5% {
        background-position: -17250px -250px;
    }

    85% {
        background-position: -17500px -250px;
    }

    85.5% {
        background-position: -17750px -250px;
    }

    86% {
        background-position: -18000px -250px;
    }

    86.5% {
        background-position: -18250px -250px;
    }

    87% {
        background-position: -18500px -250px;
    }

    87.5% {
        background-position: -18750px -250px;
    }

    88% {
        background-position: -19000px -250px;
    }

    88.5% {
        background-position: -19250px -250px;
    }

    89% {
        background-position: -19500px -250px;
    }

    89.5% {
        background-position: -19750px -250px;
    }

    90% {
        background-position: -20000px -250px;
    }

    90.5% {
        background-position: -20250px -250px;
    }

    91% {
        background-position: -20500px -250px;
    }

    91.5% {
        background-position: -20750px -250px;
    }

    92% {
        background-position: -21000px -250px;
    }

    92.5% {
        background-position: -21250px -250px;
    }

    93% {
        background-position: -21500px -250px;
    }

    93.5% {
        background-position: -21750px -250px;
    }

    94% {
        background-position: -22000px -250px;
    }

    94.5% {
        background-position: -22250px -250px;
    }

    95% {
        background-position: -22500px -250px;
    }

    95.5% {
        background-position: -22750px -250px;
    }

    96% {
        background-position: -23000px -250px;
    }

    96.5% {
        background-position: -23250px -250px;
    }

    97% {
        background-position: -23500px -250px;
    }

    97.5% {
        background-position: -23750px -250px;
    }

    98% {
        background-position: -24000px -250px;
    }

    98.5% {
        background-position: -24250px -250px;
    }

    99% {
        background-position: -24500px -250px;
    }

    99.5% {
        background-position: -24750px -250px;
    }

    100% {
        background-position: -25000px -250px;
    }
}

@-moz-keyframes bookman-dance {
    0% {
        background-position: -0 -0;
    }

    .5% {
        background-position: -250px -0;
    }

    1% {
        background-position: -500px -0;
    }

    1.5% {
        background-position: -750px -0;
    }

    2% {
        background-position: -1000px -0;
    }

    2.5% {
        background-position: -1250px -0;
    }

    3% {
        background-position: -1500px -0;
    }

    3.5% {
        background-position: -1750px -0;
    }

    4% {
        background-position: -2000px -0;
    }

    4.5% {
        background-position: -2250px -0;
    }

    5% {
        background-position: -2500px -0;
    }

    5.5% {
        background-position: -2750px -0;
    }

    6% {
        background-position: -3000px -0;
    }

    6.5% {
        background-position: -3250px -0;
    }

    7% {
        background-position: -3500px -0;
    }

    7.5% {
        background-position: -3750px -0;
    }

    8% {
        background-position: -4000px -0;
    }

    8.5% {
        background-position: -4250px -0;
    }

    9% {
        background-position: -4500px -0;
    }

    9.5% {
        background-position: -4750px -0;
    }

    10% {
        background-position: -5000px -0;
    }

    10.5% {
        background-position: -5250px -0;
    }

    11% {
        background-position: -5500px -0;
    }

    11.5% {
        background-position: -5750px -0;
    }

    12% {
        background-position: -6000px -0;
    }

    12.5% {
        background-position: -6250px -0;
    }

    13% {
        background-position: -6500px -0;
    }

    13.5% {
        background-position: -6750px -0;
    }

    14% {
        background-position: -7000px -0;
    }

    14.5% {
        background-position: -7250px -0;
    }

    15% {
        background-position: -7500px -0;
    }

    15.5% {
        background-position: -7750px -0;
    }

    16% {
        background-position: -8000px -0;
    }

    16.5% {
        background-position: -8250px -0;
    }

    17% {
        background-position: -8500px -0;
    }

    17.5% {
        background-position: -8750px -0;
    }

    18% {
        background-position: -9000px -0;
    }

    18.5% {
        background-position: -9250px -0;
    }

    19% {
        background-position: -9500px -0;
    }

    19.5% {
        background-position: -9750px -0;
    }

    20% {
        background-position: -10000px -0;
    }

    20.5% {
        background-position: -10250px -0;
    }

    21% {
        background-position: -10500px -0;
    }

    21.5% {
        background-position: -10750px -0;
    }

    22% {
        background-position: -11000px -0;
    }

    22.5% {
        background-position: -11250px -0;
    }

    23% {
        background-position: -11500px -0;
    }

    23.5% {
        background-position: -11750px -0;
    }

    24% {
        background-position: -12000px -0;
    }

    24.5% {
        background-position: -12250px -0;
    }

    25% {
        background-position: -12500px -0;
    }

    25.5% {
        background-position: -12750px -0;
    }

    26% {
        background-position: -13000px -0;
    }

    26.5% {
        background-position: -13250px -0;
    }

    27% {
        background-position: -13500px -0;
    }

    27.5% {
        background-position: -13750px -0;
    }

    28% {
        background-position: -14000px -0;
    }

    28.5% {
        background-position: -14250px -0;
    }

    29% {
        background-position: -14500px -0;
    }

    29.5% {
        background-position: -14750px -0;
    }

    30% {
        background-position: -15000px -0;
    }

    30.5% {
        background-position: -15250px -0;
    }

    31% {
        background-position: -15500px -0;
    }

    31.5% {
        background-position: -15750px -0;
    }

    32% {
        background-position: -16000px -0;
    }

    32.5% {
        background-position: -16250px -0;
    }

    33% {
        background-position: -16500px -0;
    }

    33.5% {
        background-position: -16750px -0;
    }

    34% {
        background-position: -17000px -0;
    }

    34.5% {
        background-position: -17250px -0;
    }

    35% {
        background-position: -17500px -0;
    }

    35.5% {
        background-position: -17750px -0;
    }

    36% {
        background-position: -18000px -0;
    }

    36.5% {
        background-position: -18250px -0;
    }

    37% {
        background-position: -18500px -0;
    }

    37.5% {
        background-position: -18750px -0;
    }

    38% {
        background-position: -19000px -0;
    }

    38.5% {
        background-position: -19250px -0;
    }

    39% {
        background-position: -19500px -0;
    }

    39.5% {
        background-position: -19750px -0;
    }

    40% {
        background-position: -20000px -0;
    }

    40.5% {
        background-position: -20250px -0;
    }

    41% {
        background-position: -20500px -0;
    }

    41.5% {
        background-position: -20750px -0;
    }

    42% {
        background-position: -21000px -0;
    }

    42.5% {
        background-position: -21250px -0;
    }

    43% {
        background-position: -21500px -0;
    }

    43.5% {
        background-position: -21750px -0;
    }

    44% {
        background-position: -22000px -0;
    }

    44.5% {
        background-position: -22250px -0;
    }

    45% {
        background-position: -22500px -0;
    }

    45.5% {
        background-position: -22750px -0;
    }

    46% {
        background-position: -23000px -0;
    }

    46.5% {
        background-position: -23250px -0;
    }

    47% {
        background-position: -23500px -0;
    }

    47.5% {
        background-position: -23750px -0;
    }

    48% {
        background-position: -24000px -0;
    }

    48.5% {
        background-position: -24250px -0;
    }

    49% {
        background-position: -24500px -0;
    }

    49.5% {
        background-position: -24750px -0;
    }

    50% {
        background-position: -25000px -0;
    }

    50.5% {
        background-position: -250px -250px;
    }

    51% {
        background-position: -500px -250px;
    }

    51.5% {
        background-position: -750px -250px;
    }

    52% {
        background-position: -1000px -250px;
    }

    52.5% {
        background-position: -1250px -250px;
    }

    53% {
        background-position: -1500px -250px;
    }

    53.5% {
        background-position: -1750px -250px;
    }

    54% {
        background-position: -2000px -250px;
    }

    54.5% {
        background-position: -2250px -250px;
    }

    55% {
        background-position: -2500px -250px;
    }

    55.5% {
        background-position: -2750px -250px;
    }

    56% {
        background-position: -3000px -250px;
    }

    56.5% {
        background-position: -3250px -250px;
    }

    57% {
        background-position: -3500px -250px;
    }

    57.5% {
        background-position: -3750px -250px;
    }

    58% {
        background-position: -4000px -250px;
    }

    58.5% {
        background-position: -4250px -250px;
    }

    59% {
        background-position: -4500px -250px;
    }

    59.5% {
        background-position: -4750px -250px;
    }

    60% {
        background-position: -5000px -250px;
    }

    60.5% {
        background-position: -5250px -250px;
    }

    61% {
        background-position: -5500px -250px;
    }

    61.5% {
        background-position: -5750px -250px;
    }

    62% {
        background-position: -6000px -250px;
    }

    62.5% {
        background-position: -6250px -250px;
    }

    63% {
        background-position: -6500px -250px;
    }

    63.5% {
        background-position: -6750px -250px;
    }

    64% {
        background-position: -7000px -250px;
    }

    64.5% {
        background-position: -7250px -250px;
    }

    65% {
        background-position: -7500px -250px;
    }

    65.5% {
        background-position: -7750px -250px;
    }

    66% {
        background-position: -8000px -250px;
    }

    66.5% {
        background-position: -8250px -250px;
    }

    67% {
        background-position: -8500px -250px;
    }

    67.5% {
        background-position: -8750px -250px;
    }

    68% {
        background-position: -9000px -250px;
    }

    68.5% {
        background-position: -9250px -250px;
    }

    69% {
        background-position: -9500px -250px;
    }

    69.5% {
        background-position: -9750px -250px;
    }

    70% {
        background-position: -10000px -250px;
    }

    70.5% {
        background-position: -10250px -250px;
    }

    71% {
        background-position: -10500px -250px;
    }

    71.5% {
        background-position: -10750px -250px;
    }

    72% {
        background-position: -11000px -250px;
    }

    72.5% {
        background-position: -11250px -250px;
    }

    73% {
        background-position: -11500px -250px;
    }

    73.5% {
        background-position: -11750px -250px;
    }

    74% {
        background-position: -12000px -250px;
    }

    74.5% {
        background-position: -12250px -250px;
    }

    75% {
        background-position: -12500px -250px;
    }

    75.5% {
        background-position: -12750px -250px;
    }

    76% {
        background-position: -13000px -250px;
    }

    76.5% {
        background-position: -13250px -250px;
    }

    77% {
        background-position: -13500px -250px;
    }

    77.5% {
        background-position: -13750px -250px;
    }

    78% {
        background-position: -14000px -250px;
    }

    78.5% {
        background-position: -14250px -250px;
    }

    79% {
        background-position: -14500px -250px;
    }

    79.5% {
        background-position: -14750px -250px;
    }

    80% {
        background-position: -15000px -250px;
    }

    80.5% {
        background-position: -15250px -250px;
    }

    81% {
        background-position: -15500px -250px;
    }

    81.5% {
        background-position: -15750px -250px;
    }

    82% {
        background-position: -16000px -250px;
    }

    82.5% {
        background-position: -16250px -250px;
    }

    83% {
        background-position: -16500px -250px;
    }

    83.5% {
        background-position: -16750px -250px;
    }

    84% {
        background-position: -17000px -250px;
    }

    84.5% {
        background-position: -17250px -250px;
    }

    85% {
        background-position: -17500px -250px;
    }

    85.5% {
        background-position: -17750px -250px;
    }

    86% {
        background-position: -18000px -250px;
    }

    86.5% {
        background-position: -18250px -250px;
    }

    87% {
        background-position: -18500px -250px;
    }

    87.5% {
        background-position: -18750px -250px;
    }

    88% {
        background-position: -19000px -250px;
    }

    88.5% {
        background-position: -19250px -250px;
    }

    89% {
        background-position: -19500px -250px;
    }

    89.5% {
        background-position: -19750px -250px;
    }

    90% {
        background-position: -20000px -250px;
    }

    90.5% {
        background-position: -20250px -250px;
    }

    91% {
        background-position: -20500px -250px;
    }

    91.5% {
        background-position: -20750px -250px;
    }

    92% {
        background-position: -21000px -250px;
    }

    92.5% {
        background-position: -21250px -250px;
    }

    93% {
        background-position: -21500px -250px;
    }

    93.5% {
        background-position: -21750px -250px;
    }

    94% {
        background-position: -22000px -250px;
    }

    94.5% {
        background-position: -22250px -250px;
    }

    95% {
        background-position: -22500px -250px;
    }

    95.5% {
        background-position: -22750px -250px;
    }

    96% {
        background-position: -23000px -250px;
    }

    96.5% {
        background-position: -23250px -250px;
    }

    97% {
        background-position: -23500px -250px;
    }

    97.5% {
        background-position: -23750px -250px;
    }

    98% {
        background-position: -24000px -250px;
    }

    98.5% {
        background-position: -24250px -250px;
    }

    99% {
        background-position: -24500px -250px;
    }

    99.5% {
        background-position: -24750px -250px;
    }

    100% {
        background-position: -25000px -250px;
    }
}

@-ms-keyframes bookman-dance {
    0% {
        background-position: -0 -0;
    }

    .5% {
        background-position: -250px -0;
    }

    1% {
        background-position: -500px -0;
    }

    1.5% {
        background-position: -750px -0;
    }

    2% {
        background-position: -1000px -0;
    }

    2.5% {
        background-position: -1250px -0;
    }

    3% {
        background-position: -1500px -0;
    }

    3.5% {
        background-position: -1750px -0;
    }

    4% {
        background-position: -2000px -0;
    }

    4.5% {
        background-position: -2250px -0;
    }

    5% {
        background-position: -2500px -0;
    }

    5.5% {
        background-position: -2750px -0;
    }

    6% {
        background-position: -3000px -0;
    }

    6.5% {
        background-position: -3250px -0;
    }

    7% {
        background-position: -3500px -0;
    }

    7.5% {
        background-position: -3750px -0;
    }

    8% {
        background-position: -4000px -0;
    }

    8.5% {
        background-position: -4250px -0;
    }

    9% {
        background-position: -4500px -0;
    }

    9.5% {
        background-position: -4750px -0;
    }

    10% {
        background-position: -5000px -0;
    }

    10.5% {
        background-position: -5250px -0;
    }

    11% {
        background-position: -5500px -0;
    }

    11.5% {
        background-position: -5750px -0;
    }

    12% {
        background-position: -6000px -0;
    }

    12.5% {
        background-position: -6250px -0;
    }

    13% {
        background-position: -6500px -0;
    }

    13.5% {
        background-position: -6750px -0;
    }

    14% {
        background-position: -7000px -0;
    }

    14.5% {
        background-position: -7250px -0;
    }

    15% {
        background-position: -7500px -0;
    }

    15.5% {
        background-position: -7750px -0;
    }

    16% {
        background-position: -8000px -0;
    }

    16.5% {
        background-position: -8250px -0;
    }

    17% {
        background-position: -8500px -0;
    }

    17.5% {
        background-position: -8750px -0;
    }

    18% {
        background-position: -9000px -0;
    }

    18.5% {
        background-position: -9250px -0;
    }

    19% {
        background-position: -9500px -0;
    }

    19.5% {
        background-position: -9750px -0;
    }

    20% {
        background-position: -10000px -0;
    }

    20.5% {
        background-position: -10250px -0;
    }

    21% {
        background-position: -10500px -0;
    }

    21.5% {
        background-position: -10750px -0;
    }

    22% {
        background-position: -11000px -0;
    }

    22.5% {
        background-position: -11250px -0;
    }

    23% {
        background-position: -11500px -0;
    }

    23.5% {
        background-position: -11750px -0;
    }

    24% {
        background-position: -12000px -0;
    }

    24.5% {
        background-position: -12250px -0;
    }

    25% {
        background-position: -12500px -0;
    }

    25.5% {
        background-position: -12750px -0;
    }

    26% {
        background-position: -13000px -0;
    }

    26.5% {
        background-position: -13250px -0;
    }

    27% {
        background-position: -13500px -0;
    }

    27.5% {
        background-position: -13750px -0;
    }

    28% {
        background-position: -14000px -0;
    }

    28.5% {
        background-position: -14250px -0;
    }

    29% {
        background-position: -14500px -0;
    }

    29.5% {
        background-position: -14750px -0;
    }

    30% {
        background-position: -15000px -0;
    }

    30.5% {
        background-position: -15250px -0;
    }

    31% {
        background-position: -15500px -0;
    }

    31.5% {
        background-position: -15750px -0;
    }

    32% {
        background-position: -16000px -0;
    }

    32.5% {
        background-position: -16250px -0;
    }

    33% {
        background-position: -16500px -0;
    }

    33.5% {
        background-position: -16750px -0;
    }

    34% {
        background-position: -17000px -0;
    }

    34.5% {
        background-position: -17250px -0;
    }

    35% {
        background-position: -17500px -0;
    }

    35.5% {
        background-position: -17750px -0;
    }

    36% {
        background-position: -18000px -0;
    }

    36.5% {
        background-position: -18250px -0;
    }

    37% {
        background-position: -18500px -0;
    }

    37.5% {
        background-position: -18750px -0;
    }

    38% {
        background-position: -19000px -0;
    }

    38.5% {
        background-position: -19250px -0;
    }

    39% {
        background-position: -19500px -0;
    }

    39.5% {
        background-position: -19750px -0;
    }

    40% {
        background-position: -20000px -0;
    }

    40.5% {
        background-position: -20250px -0;
    }

    41% {
        background-position: -20500px -0;
    }

    41.5% {
        background-position: -20750px -0;
    }

    42% {
        background-position: -21000px -0;
    }

    42.5% {
        background-position: -21250px -0;
    }

    43% {
        background-position: -21500px -0;
    }

    43.5% {
        background-position: -21750px -0;
    }

    44% {
        background-position: -22000px -0;
    }

    44.5% {
        background-position: -22250px -0;
    }

    45% {
        background-position: -22500px -0;
    }

    45.5% {
        background-position: -22750px -0;
    }

    46% {
        background-position: -23000px -0;
    }

    46.5% {
        background-position: -23250px -0;
    }

    47% {
        background-position: -23500px -0;
    }

    47.5% {
        background-position: -23750px -0;
    }

    48% {
        background-position: -24000px -0;
    }

    48.5% {
        background-position: -24250px -0;
    }

    49% {
        background-position: -24500px -0;
    }

    49.5% {
        background-position: -24750px -0;
    }

    50% {
        background-position: -25000px -0;
    }

    50.5% {
        background-position: -250px -250px;
    }

    51% {
        background-position: -500px -250px;
    }

    51.5% {
        background-position: -750px -250px;
    }

    52% {
        background-position: -1000px -250px;
    }

    52.5% {
        background-position: -1250px -250px;
    }

    53% {
        background-position: -1500px -250px;
    }

    53.5% {
        background-position: -1750px -250px;
    }

    54% {
        background-position: -2000px -250px;
    }

    54.5% {
        background-position: -2250px -250px;
    }

    55% {
        background-position: -2500px -250px;
    }

    55.5% {
        background-position: -2750px -250px;
    }

    56% {
        background-position: -3000px -250px;
    }

    56.5% {
        background-position: -3250px -250px;
    }

    57% {
        background-position: -3500px -250px;
    }

    57.5% {
        background-position: -3750px -250px;
    }

    58% {
        background-position: -4000px -250px;
    }

    58.5% {
        background-position: -4250px -250px;
    }

    59% {
        background-position: -4500px -250px;
    }

    59.5% {
        background-position: -4750px -250px;
    }

    60% {
        background-position: -5000px -250px;
    }

    60.5% {
        background-position: -5250px -250px;
    }

    61% {
        background-position: -5500px -250px;
    }

    61.5% {
        background-position: -5750px -250px;
    }

    62% {
        background-position: -6000px -250px;
    }

    62.5% {
        background-position: -6250px -250px;
    }

    63% {
        background-position: -6500px -250px;
    }

    63.5% {
        background-position: -6750px -250px;
    }

    64% {
        background-position: -7000px -250px;
    }

    64.5% {
        background-position: -7250px -250px;
    }

    65% {
        background-position: -7500px -250px;
    }

    65.5% {
        background-position: -7750px -250px;
    }

    66% {
        background-position: -8000px -250px;
    }

    66.5% {
        background-position: -8250px -250px;
    }

    67% {
        background-position: -8500px -250px;
    }

    67.5% {
        background-position: -8750px -250px;
    }

    68% {
        background-position: -9000px -250px;
    }

    68.5% {
        background-position: -9250px -250px;
    }

    69% {
        background-position: -9500px -250px;
    }

    69.5% {
        background-position: -9750px -250px;
    }

    70% {
        background-position: -10000px -250px;
    }

    70.5% {
        background-position: -10250px -250px;
    }

    71% {
        background-position: -10500px -250px;
    }

    71.5% {
        background-position: -10750px -250px;
    }

    72% {
        background-position: -11000px -250px;
    }

    72.5% {
        background-position: -11250px -250px;
    }

    73% {
        background-position: -11500px -250px;
    }

    73.5% {
        background-position: -11750px -250px;
    }

    74% {
        background-position: -12000px -250px;
    }

    74.5% {
        background-position: -12250px -250px;
    }

    75% {
        background-position: -12500px -250px;
    }

    75.5% {
        background-position: -12750px -250px;
    }

    76% {
        background-position: -13000px -250px;
    }

    76.5% {
        background-position: -13250px -250px;
    }

    77% {
        background-position: -13500px -250px;
    }

    77.5% {
        background-position: -13750px -250px;
    }

    78% {
        background-position: -14000px -250px;
    }

    78.5% {
        background-position: -14250px -250px;
    }

    79% {
        background-position: -14500px -250px;
    }

    79.5% {
        background-position: -14750px -250px;
    }

    80% {
        background-position: -15000px -250px;
    }

    80.5% {
        background-position: -15250px -250px;
    }

    81% {
        background-position: -15500px -250px;
    }

    81.5% {
        background-position: -15750px -250px;
    }

    82% {
        background-position: -16000px -250px;
    }

    82.5% {
        background-position: -16250px -250px;
    }

    83% {
        background-position: -16500px -250px;
    }

    83.5% {
        background-position: -16750px -250px;
    }

    84% {
        background-position: -17000px -250px;
    }

    84.5% {
        background-position: -17250px -250px;
    }

    85% {
        background-position: -17500px -250px;
    }

    85.5% {
        background-position: -17750px -250px;
    }

    86% {
        background-position: -18000px -250px;
    }

    86.5% {
        background-position: -18250px -250px;
    }

    87% {
        background-position: -18500px -250px;
    }

    87.5% {
        background-position: -18750px -250px;
    }

    88% {
        background-position: -19000px -250px;
    }

    88.5% {
        background-position: -19250px -250px;
    }

    89% {
        background-position: -19500px -250px;
    }

    89.5% {
        background-position: -19750px -250px;
    }

    90% {
        background-position: -20000px -250px;
    }

    90.5% {
        background-position: -20250px -250px;
    }

    91% {
        background-position: -20500px -250px;
    }

    91.5% {
        background-position: -20750px -250px;
    }

    92% {
        background-position: -21000px -250px;
    }

    92.5% {
        background-position: -21250px -250px;
    }

    93% {
        background-position: -21500px -250px;
    }

    93.5% {
        background-position: -21750px -250px;
    }

    94% {
        background-position: -22000px -250px;
    }

    94.5% {
        background-position: -22250px -250px;
    }

    95% {
        background-position: -22500px -250px;
    }

    95.5% {
        background-position: -22750px -250px;
    }

    96% {
        background-position: -23000px -250px;
    }

    96.5% {
        background-position: -23250px -250px;
    }

    97% {
        background-position: -23500px -250px;
    }

    97.5% {
        background-position: -23750px -250px;
    }

    98% {
        background-position: -24000px -250px;
    }

    98.5% {
        background-position: -24250px -250px;
    }

    99% {
        background-position: -24500px -250px;
    }

    99.5% {
        background-position: -24750px -250px;
    }

    100% {
        background-position: -25000px -250px;
    }
}

@-o-keyframes bookman-dance {
    0% {
        background-position: -0 -0;
    }

    .5% {
        background-position: -250px -0;
    }

    1% {
        background-position: -500px -0;
    }

    1.5% {
        background-position: -750px -0;
    }

    2% {
        background-position: -1000px -0;
    }

    2.5% {
        background-position: -1250px -0;
    }

    3% {
        background-position: -1500px -0;
    }

    3.5% {
        background-position: -1750px -0;
    }

    4% {
        background-position: -2000px -0;
    }

    4.5% {
        background-position: -2250px -0;
    }

    5% {
        background-position: -2500px -0;
    }

    5.5% {
        background-position: -2750px -0;
    }

    6% {
        background-position: -3000px -0;
    }

    6.5% {
        background-position: -3250px -0;
    }

    7% {
        background-position: -3500px -0;
    }

    7.5% {
        background-position: -3750px -0;
    }

    8% {
        background-position: -4000px -0;
    }

    8.5% {
        background-position: -4250px -0;
    }

    9% {
        background-position: -4500px -0;
    }

    9.5% {
        background-position: -4750px -0;
    }

    10% {
        background-position: -5000px -0;
    }

    10.5% {
        background-position: -5250px -0;
    }

    11% {
        background-position: -5500px -0;
    }

    11.5% {
        background-position: -5750px -0;
    }

    12% {
        background-position: -6000px -0;
    }

    12.5% {
        background-position: -6250px -0;
    }

    13% {
        background-position: -6500px -0;
    }

    13.5% {
        background-position: -6750px -0;
    }

    14% {
        background-position: -7000px -0;
    }

    14.5% {
        background-position: -7250px -0;
    }

    15% {
        background-position: -7500px -0;
    }

    15.5% {
        background-position: -7750px -0;
    }

    16% {
        background-position: -8000px -0;
    }

    16.5% {
        background-position: -8250px -0;
    }

    17% {
        background-position: -8500px -0;
    }

    17.5% {
        background-position: -8750px -0;
    }

    18% {
        background-position: -9000px -0;
    }

    18.5% {
        background-position: -9250px -0;
    }

    19% {
        background-position: -9500px -0;
    }

    19.5% {
        background-position: -9750px -0;
    }

    20% {
        background-position: -10000px -0;
    }

    20.5% {
        background-position: -10250px -0;
    }

    21% {
        background-position: -10500px -0;
    }

    21.5% {
        background-position: -10750px -0;
    }

    22% {
        background-position: -11000px -0;
    }

    22.5% {
        background-position: -11250px -0;
    }

    23% {
        background-position: -11500px -0;
    }

    23.5% {
        background-position: -11750px -0;
    }

    24% {
        background-position: -12000px -0;
    }

    24.5% {
        background-position: -12250px -0;
    }

    25% {
        background-position: -12500px -0;
    }

    25.5% {
        background-position: -12750px -0;
    }

    26% {
        background-position: -13000px -0;
    }

    26.5% {
        background-position: -13250px -0;
    }

    27% {
        background-position: -13500px -0;
    }

    27.5% {
        background-position: -13750px -0;
    }

    28% {
        background-position: -14000px -0;
    }

    28.5% {
        background-position: -14250px -0;
    }

    29% {
        background-position: -14500px -0;
    }

    29.5% {
        background-position: -14750px -0;
    }

    30% {
        background-position: -15000px -0;
    }

    30.5% {
        background-position: -15250px -0;
    }

    31% {
        background-position: -15500px -0;
    }

    31.5% {
        background-position: -15750px -0;
    }

    32% {
        background-position: -16000px -0;
    }

    32.5% {
        background-position: -16250px -0;
    }

    33% {
        background-position: -16500px -0;
    }

    33.5% {
        background-position: -16750px -0;
    }

    34% {
        background-position: -17000px -0;
    }

    34.5% {
        background-position: -17250px -0;
    }

    35% {
        background-position: -17500px -0;
    }

    35.5% {
        background-position: -17750px -0;
    }

    36% {
        background-position: -18000px -0;
    }

    36.5% {
        background-position: -18250px -0;
    }

    37% {
        background-position: -18500px -0;
    }

    37.5% {
        background-position: -18750px -0;
    }

    38% {
        background-position: -19000px -0;
    }

    38.5% {
        background-position: -19250px -0;
    }

    39% {
        background-position: -19500px -0;
    }

    39.5% {
        background-position: -19750px -0;
    }

    40% {
        background-position: -20000px -0;
    }

    40.5% {
        background-position: -20250px -0;
    }

    41% {
        background-position: -20500px -0;
    }

    41.5% {
        background-position: -20750px -0;
    }

    42% {
        background-position: -21000px -0;
    }

    42.5% {
        background-position: -21250px -0;
    }

    43% {
        background-position: -21500px -0;
    }

    43.5% {
        background-position: -21750px -0;
    }

    44% {
        background-position: -22000px -0;
    }

    44.5% {
        background-position: -22250px -0;
    }

    45% {
        background-position: -22500px -0;
    }

    45.5% {
        background-position: -22750px -0;
    }

    46% {
        background-position: -23000px -0;
    }

    46.5% {
        background-position: -23250px -0;
    }

    47% {
        background-position: -23500px -0;
    }

    47.5% {
        background-position: -23750px -0;
    }

    48% {
        background-position: -24000px -0;
    }

    48.5% {
        background-position: -24250px -0;
    }

    49% {
        background-position: -24500px -0;
    }

    49.5% {
        background-position: -24750px -0;
    }

    50% {
        background-position: -25000px -0;
    }

    50.5% {
        background-position: -250px -250px;
    }

    51% {
        background-position: -500px -250px;
    }

    51.5% {
        background-position: -750px -250px;
    }

    52% {
        background-position: -1000px -250px;
    }

    52.5% {
        background-position: -1250px -250px;
    }

    53% {
        background-position: -1500px -250px;
    }

    53.5% {
        background-position: -1750px -250px;
    }

    54% {
        background-position: -2000px -250px;
    }

    54.5% {
        background-position: -2250px -250px;
    }

    55% {
        background-position: -2500px -250px;
    }

    55.5% {
        background-position: -2750px -250px;
    }

    56% {
        background-position: -3000px -250px;
    }

    56.5% {
        background-position: -3250px -250px;
    }

    57% {
        background-position: -3500px -250px;
    }

    57.5% {
        background-position: -3750px -250px;
    }

    58% {
        background-position: -4000px -250px;
    }

    58.5% {
        background-position: -4250px -250px;
    }

    59% {
        background-position: -4500px -250px;
    }

    59.5% {
        background-position: -4750px -250px;
    }

    60% {
        background-position: -5000px -250px;
    }

    60.5% {
        background-position: -5250px -250px;
    }

    61% {
        background-position: -5500px -250px;
    }

    61.5% {
        background-position: -5750px -250px;
    }

    62% {
        background-position: -6000px -250px;
    }

    62.5% {
        background-position: -6250px -250px;
    }

    63% {
        background-position: -6500px -250px;
    }

    63.5% {
        background-position: -6750px -250px;
    }

    64% {
        background-position: -7000px -250px;
    }

    64.5% {
        background-position: -7250px -250px;
    }

    65% {
        background-position: -7500px -250px;
    }

    65.5% {
        background-position: -7750px -250px;
    }

    66% {
        background-position: -8000px -250px;
    }

    66.5% {
        background-position: -8250px -250px;
    }

    67% {
        background-position: -8500px -250px;
    }

    67.5% {
        background-position: -8750px -250px;
    }

    68% {
        background-position: -9000px -250px;
    }

    68.5% {
        background-position: -9250px -250px;
    }

    69% {
        background-position: -9500px -250px;
    }

    69.5% {
        background-position: -9750px -250px;
    }

    70% {
        background-position: -10000px -250px;
    }

    70.5% {
        background-position: -10250px -250px;
    }

    71% {
        background-position: -10500px -250px;
    }

    71.5% {
        background-position: -10750px -250px;
    }

    72% {
        background-position: -11000px -250px;
    }

    72.5% {
        background-position: -11250px -250px;
    }

    73% {
        background-position: -11500px -250px;
    }

    73.5% {
        background-position: -11750px -250px;
    }

    74% {
        background-position: -12000px -250px;
    }

    74.5% {
        background-position: -12250px -250px;
    }

    75% {
        background-position: -12500px -250px;
    }

    75.5% {
        background-position: -12750px -250px;
    }

    76% {
        background-position: -13000px -250px;
    }

    76.5% {
        background-position: -13250px -250px;
    }

    77% {
        background-position: -13500px -250px;
    }

    77.5% {
        background-position: -13750px -250px;
    }

    78% {
        background-position: -14000px -250px;
    }

    78.5% {
        background-position: -14250px -250px;
    }

    79% {
        background-position: -14500px -250px;
    }

    79.5% {
        background-position: -14750px -250px;
    }

    80% {
        background-position: -15000px -250px;
    }

    80.5% {
        background-position: -15250px -250px;
    }

    81% {
        background-position: -15500px -250px;
    }

    81.5% {
        background-position: -15750px -250px;
    }

    82% {
        background-position: -16000px -250px;
    }

    82.5% {
        background-position: -16250px -250px;
    }

    83% {
        background-position: -16500px -250px;
    }

    83.5% {
        background-position: -16750px -250px;
    }

    84% {
        background-position: -17000px -250px;
    }

    84.5% {
        background-position: -17250px -250px;
    }

    85% {
        background-position: -17500px -250px;
    }

    85.5% {
        background-position: -17750px -250px;
    }

    86% {
        background-position: -18000px -250px;
    }

    86.5% {
        background-position: -18250px -250px;
    }

    87% {
        background-position: -18500px -250px;
    }

    87.5% {
        background-position: -18750px -250px;
    }

    88% {
        background-position: -19000px -250px;
    }

    88.5% {
        background-position: -19250px -250px;
    }

    89% {
        background-position: -19500px -250px;
    }

    89.5% {
        background-position: -19750px -250px;
    }

    90% {
        background-position: -20000px -250px;
    }

    90.5% {
        background-position: -20250px -250px;
    }

    91% {
        background-position: -20500px -250px;
    }

    91.5% {
        background-position: -20750px -250px;
    }

    92% {
        background-position: -21000px -250px;
    }

    92.5% {
        background-position: -21250px -250px;
    }

    93% {
        background-position: -21500px -250px;
    }

    93.5% {
        background-position: -21750px -250px;
    }

    94% {
        background-position: -22000px -250px;
    }

    94.5% {
        background-position: -22250px -250px;
    }

    95% {
        background-position: -22500px -250px;
    }

    95.5% {
        background-position: -22750px -250px;
    }

    96% {
        background-position: -23000px -250px;
    }

    96.5% {
        background-position: -23250px -250px;
    }

    97% {
        background-position: -23500px -250px;
    }

    97.5% {
        background-position: -23750px -250px;
    }

    98% {
        background-position: -24000px -250px;
    }

    98.5% {
        background-position: -24250px -250px;
    }

    99% {
        background-position: -24500px -250px;
    }

    99.5% {
        background-position: -24750px -250px;
    }

    100% {
        background-position: -25000px -250px;
    }
}

@keyframes bookman-dance {
    0% {
        background-position: -0 -0;
    }

    .5% {
        background-position: -250px -0;
    }

    1% {
        background-position: -500px -0;
    }

    1.5% {
        background-position: -750px -0;
    }

    2% {
        background-position: -1000px -0;
    }

    2.5% {
        background-position: -1250px -0;
    }

    3% {
        background-position: -1500px -0;
    }

    3.5% {
        background-position: -1750px -0;
    }

    4% {
        background-position: -2000px -0;
    }

    4.5% {
        background-position: -2250px -0;
    }

    5% {
        background-position: -2500px -0;
    }

    5.5% {
        background-position: -2750px -0;
    }

    6% {
        background-position: -3000px -0;
    }

    6.5% {
        background-position: -3250px -0;
    }

    7% {
        background-position: -3500px -0;
    }

    7.5% {
        background-position: -3750px -0;
    }

    8% {
        background-position: -4000px -0;
    }

    8.5% {
        background-position: -4250px -0;
    }

    9% {
        background-position: -4500px -0;
    }

    9.5% {
        background-position: -4750px -0;
    }

    10% {
        background-position: -5000px -0;
    }

    10.5% {
        background-position: -5250px -0;
    }

    11% {
        background-position: -5500px -0;
    }

    11.5% {
        background-position: -5750px -0;
    }

    12% {
        background-position: -6000px -0;
    }

    12.5% {
        background-position: -6250px -0;
    }

    13% {
        background-position: -6500px -0;
    }

    13.5% {
        background-position: -6750px -0;
    }

    14% {
        background-position: -7000px -0;
    }

    14.5% {
        background-position: -7250px -0;
    }

    15% {
        background-position: -7500px -0;
    }

    15.5% {
        background-position: -7750px -0;
    }

    16% {
        background-position: -8000px -0;
    }

    16.5% {
        background-position: -8250px -0;
    }

    17% {
        background-position: -8500px -0;
    }

    17.5% {
        background-position: -8750px -0;
    }

    18% {
        background-position: -9000px -0;
    }

    18.5% {
        background-position: -9250px -0;
    }

    19% {
        background-position: -9500px -0;
    }

    19.5% {
        background-position: -9750px -0;
    }

    20% {
        background-position: -10000px -0;
    }

    20.5% {
        background-position: -10250px -0;
    }

    21% {
        background-position: -10500px -0;
    }

    21.5% {
        background-position: -10750px -0;
    }

    22% {
        background-position: -11000px -0;
    }

    22.5% {
        background-position: -11250px -0;
    }

    23% {
        background-position: -11500px -0;
    }

    23.5% {
        background-position: -11750px -0;
    }

    24% {
        background-position: -12000px -0;
    }

    24.5% {
        background-position: -12250px -0;
    }

    25% {
        background-position: -12500px -0;
    }

    25.5% {
        background-position: -12750px -0;
    }

    26% {
        background-position: -13000px -0;
    }

    26.5% {
        background-position: -13250px -0;
    }

    27% {
        background-position: -13500px -0;
    }

    27.5% {
        background-position: -13750px -0;
    }

    28% {
        background-position: -14000px -0;
    }

    28.5% {
        background-position: -14250px -0;
    }

    29% {
        background-position: -14500px -0;
    }

    29.5% {
        background-position: -14750px -0;
    }

    30% {
        background-position: -15000px -0;
    }

    30.5% {
        background-position: -15250px -0;
    }

    31% {
        background-position: -15500px -0;
    }

    31.5% {
        background-position: -15750px -0;
    }

    32% {
        background-position: -16000px -0;
    }

    32.5% {
        background-position: -16250px -0;
    }

    33% {
        background-position: -16500px -0;
    }

    33.5% {
        background-position: -16750px -0;
    }

    34% {
        background-position: -17000px -0;
    }

    34.5% {
        background-position: -17250px -0;
    }

    35% {
        background-position: -17500px -0;
    }

    35.5% {
        background-position: -17750px -0;
    }

    36% {
        background-position: -18000px -0;
    }

    36.5% {
        background-position: -18250px -0;
    }

    37% {
        background-position: -18500px -0;
    }

    37.5% {
        background-position: -18750px -0;
    }

    38% {
        background-position: -19000px -0;
    }

    38.5% {
        background-position: -19250px -0;
    }

    39% {
        background-position: -19500px -0;
    }

    39.5% {
        background-position: -19750px -0;
    }

    40% {
        background-position: -20000px -0;
    }

    40.5% {
        background-position: -20250px -0;
    }

    41% {
        background-position: -20500px -0;
    }

    41.5% {
        background-position: -20750px -0;
    }

    42% {
        background-position: -21000px -0;
    }

    42.5% {
        background-position: -21250px -0;
    }

    43% {
        background-position: -21500px -0;
    }

    43.5% {
        background-position: -21750px -0;
    }

    44% {
        background-position: -22000px -0;
    }

    44.5% {
        background-position: -22250px -0;
    }

    45% {
        background-position: -22500px -0;
    }

    45.5% {
        background-position: -22750px -0;
    }

    46% {
        background-position: -23000px -0;
    }

    46.5% {
        background-position: -23250px -0;
    }

    47% {
        background-position: -23500px -0;
    }

    47.5% {
        background-position: -23750px -0;
    }

    48% {
        background-position: -24000px -0;
    }

    48.5% {
        background-position: -24250px -0;
    }

    49% {
        background-position: -24500px -0;
    }

    49.5% {
        background-position: -24750px -0;
    }

    50% {
        background-position: -25000px -0;
    }

    50.5% {
        background-position: -250px -250px;
    }

    51% {
        background-position: -500px -250px;
    }

    51.5% {
        background-position: -750px -250px;
    }

    52% {
        background-position: -1000px -250px;
    }

    52.5% {
        background-position: -1250px -250px;
    }

    53% {
        background-position: -1500px -250px;
    }

    53.5% {
        background-position: -1750px -250px;
    }

    54% {
        background-position: -2000px -250px;
    }

    54.5% {
        background-position: -2250px -250px;
    }

    55% {
        background-position: -2500px -250px;
    }

    55.5% {
        background-position: -2750px -250px;
    }

    56% {
        background-position: -3000px -250px;
    }

    56.5% {
        background-position: -3250px -250px;
    }

    57% {
        background-position: -3500px -250px;
    }

    57.5% {
        background-position: -3750px -250px;
    }

    58% {
        background-position: -4000px -250px;
    }

    58.5% {
        background-position: -4250px -250px;
    }

    59% {
        background-position: -4500px -250px;
    }

    59.5% {
        background-position: -4750px -250px;
    }

    60% {
        background-position: -5000px -250px;
    }

    60.5% {
        background-position: -5250px -250px;
    }

    61% {
        background-position: -5500px -250px;
    }

    61.5% {
        background-position: -5750px -250px;
    }

    62% {
        background-position: -6000px -250px;
    }

    62.5% {
        background-position: -6250px -250px;
    }

    63% {
        background-position: -6500px -250px;
    }

    63.5% {
        background-position: -6750px -250px;
    }

    64% {
        background-position: -7000px -250px;
    }

    64.5% {
        background-position: -7250px -250px;
    }

    65% {
        background-position: -7500px -250px;
    }

    65.5% {
        background-position: -7750px -250px;
    }

    66% {
        background-position: -8000px -250px;
    }

    66.5% {
        background-position: -8250px -250px;
    }

    67% {
        background-position: -8500px -250px;
    }

    67.5% {
        background-position: -8750px -250px;
    }

    68% {
        background-position: -9000px -250px;
    }

    68.5% {
        background-position: -9250px -250px;
    }

    69% {
        background-position: -9500px -250px;
    }

    69.5% {
        background-position: -9750px -250px;
    }

    70% {
        background-position: -10000px -250px;
    }

    70.5% {
        background-position: -10250px -250px;
    }

    71% {
        background-position: -10500px -250px;
    }

    71.5% {
        background-position: -10750px -250px;
    }

    72% {
        background-position: -11000px -250px;
    }

    72.5% {
        background-position: -11250px -250px;
    }

    73% {
        background-position: -11500px -250px;
    }

    73.5% {
        background-position: -11750px -250px;
    }

    74% {
        background-position: -12000px -250px;
    }

    74.5% {
        background-position: -12250px -250px;
    }

    75% {
        background-position: -12500px -250px;
    }

    75.5% {
        background-position: -12750px -250px;
    }

    76% {
        background-position: -13000px -250px;
    }

    76.5% {
        background-position: -13250px -250px;
    }

    77% {
        background-position: -13500px -250px;
    }

    77.5% {
        background-position: -13750px -250px;
    }

    78% {
        background-position: -14000px -250px;
    }

    78.5% {
        background-position: -14250px -250px;
    }

    79% {
        background-position: -14500px -250px;
    }

    79.5% {
        background-position: -14750px -250px;
    }

    80% {
        background-position: -15000px -250px;
    }

    80.5% {
        background-position: -15250px -250px;
    }

    81% {
        background-position: -15500px -250px;
    }

    81.5% {
        background-position: -15750px -250px;
    }

    82% {
        background-position: -16000px -250px;
    }

    82.5% {
        background-position: -16250px -250px;
    }

    83% {
        background-position: -16500px -250px;
    }

    83.5% {
        background-position: -16750px -250px;
    }

    84% {
        background-position: -17000px -250px;
    }

    84.5% {
        background-position: -17250px -250px;
    }

    85% {
        background-position: -17500px -250px;
    }

    85.5% {
        background-position: -17750px -250px;
    }

    86% {
        background-position: -18000px -250px;
    }

    86.5% {
        background-position: -18250px -250px;
    }

    87% {
        background-position: -18500px -250px;
    }

    87.5% {
        background-position: -18750px -250px;
    }

    88% {
        background-position: -19000px -250px;
    }

    88.5% {
        background-position: -19250px -250px;
    }

    89% {
        background-position: -19500px -250px;
    }

    89.5% {
        background-position: -19750px -250px;
    }

    90% {
        background-position: -20000px -250px;
    }

    90.5% {
        background-position: -20250px -250px;
    }

    91% {
        background-position: -20500px -250px;
    }

    91.5% {
        background-position: -20750px -250px;
    }

    92% {
        background-position: -21000px -250px;
    }

    92.5% {
        background-position: -21250px -250px;
    }

    93% {
        background-position: -21500px -250px;
    }

    93.5% {
        background-position: -21750px -250px;
    }

    94% {
        background-position: -22000px -250px;
    }

    94.5% {
        background-position: -22250px -250px;
    }

    95% {
        background-position: -22500px -250px;
    }

    95.5% {
        background-position: -22750px -250px;
    }

    96% {
        background-position: -23000px -250px;
    }

    96.5% {
        background-position: -23250px -250px;
    }

    97% {
        background-position: -23500px -250px;
    }

    97.5% {
        background-position: -23750px -250px;
    }

    98% {
        background-position: -24000px -250px;
    }

    98.5% {
        background-position: -24250px -250px;
    }

    99% {
        background-position: -24500px -250px;
    }

    99.5% {
        background-position: -24750px -250px;
    }

    100% {
        background-position: -25000px -250px;
    }
}

.level-packs {
    /*background:white;*/
    margin-top: 18px;
}

    .level-packs > div:not(.spacer) {
        clear: both;
        min-height: 59px;
        background: white;
    }

    .level-packs > div.listview.selected, .level-packs > div.listview.selected > div {
        background-color: #fffdd6;
    }

    .level-packs > div.spacer {
        clear: both;
        height: 0;
    }

    .level-packs > div.listview {
        border-bottom: none;
    }

        .level-packs > div.listview > div:not(:last-child) > div.subheader {
            border: none;
        }

        .level-packs > div.listview > div > div.header.to-buy {
            padding-top: 17px;
        }

        .level-packs > div.listview > div.spacer {
            height: 0;
            clear: both;
        }

    .level-packs .button.green {
        white-space: nowrap;
        margin-top: 10px;
    }

        .level-packs .button.green > .price {
            margin-left: 5px;
        }

    .level-packs > div > .timed-game, .level-packs > div > .untimed-game {
        float: right;
        background-repeat: no-repeat;
        background-position: 13px;
        padding: 0 20px 0 0;
        width: 230px;
        white-space: nowrap;
        border-left: 1px solid #e5e7e9;
    }
        /*.level-packs > div > .timed-game.not-clickable, .level-packs > div > .untimed-game.not-clickable {
        width: 163px;
        padding: 0 10px 0 10px;
    }
    .level-packs > div > .timed-game.not-clickable>.header, .level-packs > div > .untimed-game.not-clickable>.header,
    .level-packs > div > .timed-game.not-clickable>.subheader, .level-packs > div > .untimed-game.not-clickable>.subheader {
        margin-left: 0;
    }*/
        .level-packs > div > .timed-game > .header, .level-packs > div > .untimed-game > .header {
            padding-top: 4px;
            height: 26px;
        }

        .level-packs > div > .timed-game > .subheader, .level-packs > div > .untimed-game > .subheader {
            padding-bottom: 3px;
            height: 32px;
        }

    .level-packs > div > .progress-gauge, .level-packs > div > .progress-text {
        float: left;
    }

    .level-packs > div > .progress-text {
        padding: 0 20px;
    }

        .level-packs > div > .progress-text > .header {
            padding-top: 10px;
        }

        .level-packs > div > .progress-text > .header, .level-packs > div > .progress-text > .subheader {
            margin: 0;
        }

    .level-packs > div > .progress-gauge {
        margin: 7px 0 0 16px;
    }

        .level-packs > div > .progress-gauge > .locker {
            width: 43px;
            height: 43px;
            background-repeat: no-repeat;
            -ms-border-radius: 24px;
            -moz-border-radius: 24px;
            -webkit-border-radius: 24px;
            border-radius: 24px;
            display: inline-block;
        }

    .level-packs > img.profile {
        float: left;
    }

    .level-packs > .summary {
        margin-bottom: 18px;
        background: white;
        min-height: 74px;
    }

    .level-packs > table.summary {
        width: 100%;
        text-align: left;
    }

        .level-packs > table.summary > tbody > tr > td:first-child {
            width: 98px;
        }

        .level-packs > table.summary > tbody > tr > td:last-child {
            width: 240px;
            font-size: 14px;
            padding-right: 10px;
            color: #34495e;
        }

        .level-packs > table.summary > tbody > tr > td > .button.green {
            float: right;
            margin: 0 0 0 4px;
            padding: 1px 7px;
        }

        .level-packs > table.summary > tbody > tr > td > .button.save-levels > .popup {
            left: auto;
            right: 27px;
            top: 70px;
        }

            .level-packs > table.summary > tbody > tr > td > .button.save-levels > .popup::before {
                right: 35px;
                left: auto;
            }

div.level-packs > div.summary.listview > div.spacer {
    float: none;
    height: 1px;
}

.level-packs > .summary > div:not(.share-buttons), .level-packs > .summary > div > div, .level-packs > .summary > tbody > tr > td > div {
    float: left;
}

.level-packs > .summary > tbody > tr > td > div {
    white-space: nowrap;
}

    .level-packs > .summary > tbody > tr > td > div > div:not(.popup) {
        display: inline-block;
    }

.level-packs > div.summary > div > img.profile, .level-packs > table.summary > tbody > tr > td > img.profile {
    margin: 3px 20px 3px 10px;
    cursor: pointer;
}

.level-packs > div.summary.listview > div > .subheader, .level-packs > div.summary.listview > div > .header {
    height: auto;
    padding: 0;
    margin: 1px 0 0 0;
}

.level-packs > div.summary.listview > div > .header, .level-packs > .summary > tbody > tr > td > div > .header {
    font-size: 27px;
    color: #34495e;
}

.level-packs > div.summary.listview > div > .subheader, .level-packs > .summary > tbody > tr > td > div > .subheader {
    margin: 5px 24px 0 8px;
    font-size: 13px;
    color: #808d8e;
}

.level-packs > div.summary.listview > div:not(:first-child) {
    margin-top: 15px;
    height: 47px;
}

.level-packs > div.summary.listview > .share-buttons {
    float: right;
    max-width: 275px;
}

.round-results > .level-packs > div.summary.listview > .share-buttons, .round-results > .level-packs > div.summary.listview > div:first-child {
    margin-top: 5px;
    margin-bottom: 5px;
    height: 80px;
}

@media (max-width:732px) {
    .round-results > .level-packs > div.summary.listview > div:not(:first-child) {
        margin-top: 5px;
        height: auto;
    }
}

.level-packs > div.summary.listview > .share-buttons > .alt-button {
    float: left;
}

.rating-chart {
    height: 140px;
}

.rating-chart-label {
    font-size: 16px;
    color: #34495e;
}

.rating-chart > canvas {
    -moz-min-width: 600px;
    -ms-min-width: 600px;
    -o-min-width: 600px;
    -webkit-min-width: 600px;
    min-width: 600px;
}

.flag-icon {
    margin-top: -4px;
}

.listview > div {
    position: relative;
}

    .listview > div > img.flag-icon {
        float: left;
        margin-top: 2px;
        margin-left: -14px;
    }

.statistics > .playerInfo > .profile > .flag-icon.big {
    margin-top: -20px;
    margin-left: -16px;
}

.lang-challenge > div > .button.white {
    float: right;
    padding: 8px 30px;
    margin-right: 70px;
    margin-left: -70px;
}

.button.with-icon {
    padding: 4px;
}

    .button.with-icon > span {
        float: left;
        margin: 3px 10px 3px 6px;
    }

        .button.with-icon > span.round {
            display: inline-block;
            overflow: hidden;
            width: 30px;
            height: 30px;
            border: 2px solid white;
            border-radius: 15px;
            margin: 0;
        }

            .button.with-icon > span.round > img.biggest {
                margin: -11px 0 0 -11px;
            }

.sharing-buttons {
    width:100%;
    position:absolute;
    top:59px;
}
.sharing-buttons>div{
    position: relative;
    height:23px;
}

.sharing-buttons>div > div.fb-share-button, .sharing-buttons>div > div#vk_like, .sharing-buttons>div > div.gp-like {
    position: absolute !important;
    z-index: 4;
    top:3px;
}

.sharing-buttons>div > div.fb-share-button {
    left:213px;
}

.sharing-buttons>div > div.gp-like {
    left:125px;
}

.sharing-buttons>div > div#vk_like {
    left:30px;
    top: 3px;
}

@media(max-width:542px) {
    .sharing-buttons > div > div#vk_like {
        top: 0;
    }
}

div.score-sum > span, div.header > span.time-left,body, .global-messages input[type=text], .new-game-social > .toolbar > input, select,.letter, .selected-chars, .word-answer{
    font-family: Comfortaa;
}

body, .global-messages input[type=text], .new-game-social > .toolbar > input, select {
    font-weight: bold;
}


body {
    background-image: url(../img/bg-graphics-pattern.png?r=2);
    background-attachment: fixed;
}
div.game-menu > div.header > .navbar-logo {
    background: url(../img/wh-navbar-logo.png?r=2) no-repeat;
}