
body {
    font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
    padding: 0;
    margin: 0;
    background: url(/imgs/bg_map.png) no-repeat center center fixed, url(/imgs/bg_grey.jpg) repeat;
    font-size: 90%;
    letter-spacing: 0.02em;
    overflow-x: hidden;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active  {
    transition: background-color 5000s ease-in-out 0s;
    -webkit-text-fill-color: white;


}

input::placeholder {
    color: white;
}
div.content {
    display: flex;
    align-items: flex-start;
}
.imgLogo {
    margin-bottom: -6px;
}
.otst {
    height: 70px;
}
a {
    color: #069;
    text-decoration: none;
}
#menu > div > b > a {
    padding: 4px 1px;
}
.workDiv {
    padding-top: 40px;
    width: 80%;
    margin: 0 auto 0 auto;
    max-width: 1280px;
}
#captcha_table {
    margin: 4px;
    padding: 10px;
    background: rgba(255, 255, 255, 0.4);
    width: 50%;
    float: left;
}
#sessions_table {
    margin: 4px;
    padding: 10px;
    background: rgba(255, 255, 255, 0.4);
    width: 50%;
    float: right;
}

.header {
    width: 100%;
    background-size: cover;
}

#errors{
    padding:16px 32px 0 32px;
    color: #333
}

.bg-bottom {
    background: url(/imgs/divider_bg.png) repeat-x 0 bottom;
    padding: 0 0 95px;

}

#change_purse {
    outline: 0 !important;
}

.bg-bottom-first-div {
    display: flex;
    flex-wrap: nowrap;
    max-width: 1024px;
    width: 80%;
    margin: 0 auto 0 auto;
}

.bg-bottom-second-div {
    color: #FFFFFF;
    flex-grow: 1;
    min-width: 49%;
    /*margin-right: 16px;*/
    transition: all 400ms ease-out 100ms;
}

.formTransition {
    margin-right: 720px;
}


/*.bg-bottom table td:hover{ opacity:0.9;}*/
#start_form input {
    padding: 16px;
    border: 0;
    border-radius: 4px;
    color: #FFF;
    text-align: center;
}

#start_form input::placeholder {
    color: #ffffff70;
    letter-spacing: 0.05em;
}

#start_form img {
    border: 1px solid #CCC;
    border-radius: 2px;
    margin: 4px;
}

#send_button {
    width: 160px;
}

input {
    outline: 0;
}

input[type="button"] {
    cursor: pointer;
    border: 1px solid #CCC;
    padding: 8px;
    outline: 0;
}

input[type="button"]:hover {
    background-color: #F8F8F8;

}

input[type="text"] {
    /*cursor: pointer;*/
    border: 1px solid #CCC;
    outline: 0;
}

#captcha_input {
    padding: 8px;
}
#divStory {

    height: 400px;
    overflow: auto;
    width: 90%;
    margin: 0 auto 0 auto;
    max-width: 1024px;
}


#divStory > table {
    width: 100%;
    padding-bottom: 16px;


}

#pay_methods div {
    width: 90%;
    margin: 0 auto 0 auto;
    max-width: 1024px;
}

#pay_methods img {
    padding-right: 8px;
}

#top_flags {
    padding: 10px;
    background: rgba(255, 255, 255, 0.5);
}

#top_flags img {
    width: 36px;
    box-shadow: 0 0 0 2px #999;
    cursor: pointer;
}

#top_flags img:hover {
    width: 36px;
    box-shadow: 0 0 0 2px #777;
    cursor: pointer;
}

.tops {
    position: fixed;
    bottom: 1px;
    left: 42%;
}

.tops img {
    box-shadow: 0 0 0 1px #CCC;
    cursor: pointer;
    opacity: 0.3;

}

.tops img:hover {
    opacity: 0.9;
}


td select {
    height: 53px;
    border: 0;
    border-radius: 4px;
    color: #FFF;
    text-align: center;
    width: 260px;
    background-color: #1EAEEA;
}

#earned {
    padding-left: 2px;
    font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
}

@media only screen and (max-width: 1380px) {
    .bg-bottom-first-div, #pay_methods div, .workDiv {
        width: 90%;
    }
    table > tbody > tr > td > span > span {
        display: none;

    }

    #loading > span {
        display: none;
    }

}

@media only screen and (max-width: 1024px) {


    #captcha_table {
        width: 100%;
    }

    #sessions_table {
        width: 100%;
    }

    div.content {
        flex-wrap: wrap;
    }

    .bg-bottom-first-div {
        display: flex;
        flex-wrap: wrap;
        width: 90%;
        margin: 0 auto 0 auto;
    }

    .otst {
        height: 20px;
    }
}


@media only screen and (max-width: 800px) {
    .bg-bottom-first-div, #pay_methods div, .workDiv {
        width: 100%;
    }

    .workDiv {
        padding-top: unset;
    }

    .bg-bottom-second-div, #pay_methods {
        margin: 16px;
    }
    .hide {
        display: none;
    }

}
