@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700);
@media screen {
/* ========== START MAIN ========== */
* {
 border:0;
 margin:0;
 padding:0;
 outline:0;
}

body {
 color:#107c0f;
 font-size:1.1em;
 text-align:center;
 background:#107c0f;
 font-family:'Open Sans',Arial,Helvetica,sans-serif;
}

.wrap {
 margin:0 auto;
 max-width:1020px;
 position:relative;
}

input:invalid {
 box-shadow:none;
}
/* ========== END MAIN ========== */
/* ========== START HEAD ========== */
#head {
 width:100%;
 height:112px;
 background:#107c0f;
}

#logo {
 margin-top:23px;
 max-height:66px;
}
/* ========== END HEAD ========== */
/* ========== START TEXT ========== */
#text {
 width:100%;
 cursor:default;
 background:#fff;
 padding-bottom:2em;
}

h1 {
 font-size:1.6em;
 font-weight:700;
 padding:1.5em 0 0.1em 0;
}
/* ========== END TEXT ========== */
/* ========== START TEST ========== */
#test {
 background:#fff;
 padding:0 0 2.6em 0;
}

#look {
 margin:0 auto;
 overflow:auto;
 text-align:left;
 max-width:400px;
 position:relative;
 background:#f1f7f1;
 border-radius:10px;
 -moz-border-radius:10px;
 -khtml-border-radius:10px;
 -webkit-border-radius:10px;
 padding:3.5em 40px 4.5em 40px;
 border:5px solid #f1f7f1;
}

#look label {
 float:left;
 width:100%;
 margin:0 0 2px 0;
}

#look label span {
 color:#f00;
 float:left;
 width:100%;
 font-weight:700;
}

#look input {
 float:left;
 width:100%;
 height:48px;
 font:inherit;
 color:#107c0f;
 border-radius:0;
 text-indent:10px;
 margin-bottom:0.2em;
 box-sizing:border-box;
 -webkit-appearance:none;
 -o-box-sizing:border-box;
 -ms-box-sizing:border-box;
 -moz-box-sizing:border-box;
 -webkit-box-sizing:border-box;
 border:1px solid #107c0f;
 line-height:48px;
}

#look input.inside {
 color:#f00;
 background:#fff6f6;
 border:1px solid #f00;
}

input#doitnow {
 color:#fff;
 height:64px;
 cursor:pointer;
 font-size:1.4em;
 font-weight:400;
 text-align:center;
 margin:0.6em 0 0 0;
 background:#ff5400;
 border:1px solid #ff5400;
 line-height:64px;
}

input#doitnow:hover {
 background:#e84c00;
}

#yres {
 margin:0 auto;
 overflow:auto;
 cursor:default;
 max-width:400px;
 text-align:center;
 position:relative;
 background:#f1f7f1;
 border-radius:10px;
 -moz-border-radius:10px;
 -khtml-border-radius:10px;
 -webkit-border-radius:10px;
 padding:2.5em 40px 3.5em 40px;
 border:5px solid #f1f7f1;
}

#nres {
 color:#f00;
 margin:0 auto;
 overflow:auto;
 cursor:default;
 max-width:400px;
 text-align:center;
 position:relative;
 background:#fff9f9;
 border-radius:10px;
 -moz-border-radius:10px;
 -khtml-border-radius:10px;
 -webkit-border-radius:10px;
 padding:2.5em 40px 3.5em 40px;
 border:5px solid #fff9f9;
}

#yres h2, #nres h2 {
 font-size:1.2em;
 padding:0.4em 0 0.3em 0;
}

#yres a, #nres a {
 width:100%;
 color:#fff;
 height:64px;
 font-size:1.4em;
 font-weight:400;
 margin:2em 0 0 0;
 background:#ff5400;
 display:inline-block;
 text-decoration:none;
 border:1px solid #ff5400;
 line-height:64px;
}

#yres a:hover, #nres a:hover {
 background:#e84c00;
}

#myage, #voice {
 display:none;
}
/* ========== END TEST ========== */
/* ========== START RULE ========== */
.rule {
 cursor:default;
 background:#fff;
 padding:0 0 1.6em 0;
}

.rule h2 {
 font-size:1em;
 font-weight:700;
 padding:0 0 0.3em 0;
}

.rule h3 {
 font-size:1em;
 font-weight:700;
 padding:1.2em 0 0.3em 0;
}

.rule ul {
 font-size:0.9em;
 list-style:none;
}
/* ========== END RULE ========== */
/* ========== START FOOT ========== */
#foot {
 overflow:auto;
 color:#a8cfa8;
 padding:3em 0;
 cursor:default;
 font-size:0.8em;
 background:#107c0f;
}

#foot p:nth-child(1) {
 padding:0 0 1.4em 0;
}

#foot a {
 color:#a8cfa8;
 text-decoration:none;
}

#foot a:hover {
 text-decoration:underline;
}
/* ========== END FOOT ========== */
/* ========== START LANG ========== */
#lang {
 overflow:auto;
 background:#107c0f;
 padding:0 0 2.2em 0;
}

#lang img {
 max-height:28px;
}

#lang li {
 margin:0 2px;
 list-style:none;
 display:inline-block;
}
/* ========== END LANG ========== */
/* ========== START GAME ========== */
.topgame, .downgame {
 overflow:auto;
 background:#fff;
 padding:0 0 1.5em 0;
}

.topgame img, .downgame img {
 max-width:110px;
 border:1px solid #107c0f;
}

.topgame li, .downgame li {
 margin:0 3px;
 list-style:none;
 display:inline-block;
}
/* ========== END GAME ========== */
}
/* ========== START RESP ========== */
@media (max-width:1280px){
.wrap {
 padding:0 20px;
 max-width:1020px;
}
}

@media (max-width:840px){
#head {
 height:96px;
}

#logo {
 margin-top:22px;
 max-height:52px;
}
}

@media (max-width:480px){
#head {
 height:84px;
}

#logo {
 margin-top:20px;
 max-height:44px;
}

#text {
 font-size:1em;
 padding-bottom:1.6em;
}

h1 {
 font-size:1.4em;
 font-weight:400;
 padding:1.2em 0 0.1em 0;
}

#look {
 border:3px solid #f1f7f1;
 padding:2.8em 24px 3.6em 24px;
}

#yres {
 padding:2em 24px 3em 24px;
 border:3px solid #f1f7f1;
}

#nres {
 padding:2em 24px 3em 24px;
 border:3px solid #fff9f9;
}

#yres a, #nres a {
 margin:1.6em 0 0 0;
}

.rule h2 {
 font-size:0.9em;
 font-weight:400;
 padding:0 0 0.4em 0;
}

.rule h3 {
 font-size:0.9em;
 font-weight:400;
 padding:1em 0 0.4em 0;
}

.rule ul {
 font-size:0.8em;
}
}

@media (max-width:360px){
#text {
 font-size:0.9em;
}

h1 {
 font-size:1.2em;
}

#look {
 padding:2.4em 20px 2.2em 20px;
}

#look label {
 font-size:0.9em;
}

#look label span {
 font-weight:400;
}

input#doitnow {
 height:52px;
 font-size:1.2em;
 margin:0.8em 0 0 0;
 line-height:52px;
}

#yres a, #nres a {
 height:52px;
 font-size:1.2em;
 line-height:52px;
}

#lang img {
 max-height:24px;
}
}

@media (max-width:320px){
#lang img {
 max-height:20px;
}
}

@media (max-width:1016px){
.topgame li:nth-child(15), .topgame li:nth-child(16), .downgame li:nth-child(15), .downgame li:nth-child(16) {
 display:none;
}
}

@media (max-width:893px){
.topgame li:nth-child(13), .topgame li:nth-child(14), .downgame li:nth-child(13), .downgame li:nth-child(14) {
 display:none;
}
}

@media (max-width:770px){
.topgame li:nth-child(11), .topgame li:nth-child(12), .downgame li:nth-child(11), .downgame li:nth-child(12) {
 display:none;
}
}

@media (max-width:648px){
.topgame li:nth-child(9), .topgame li:nth-child(10) {
 display:none;
}

.downgame li:nth-child(11), .downgame li:nth-child(12) {
 display:inline-block;
}
}

@media (max-width:525px){
.topgame li:nth-child(7), .topgame li:nth-child(8) {
 display:none;
}
}

@media (max-width:403px){
.topgame li:nth-child(5), .topgame li:nth-child(6), .downgame li:nth-child(11), .downgame li:nth-child(12) {
 display:none;
}
}

@media (max-width:280px){
.topgame li:nth-child(2), .topgame li:nth-child(3), .topgame li:nth-child(4), .downgame li:nth-child(6), .downgame li:nth-child(7), .downgame li:nth-child(8), .downgame li:nth-child(9), .downgame li:nth-child(10) {
 display:none;
}
}

@media print {
body {
 display:none;
}
}