html { background: #222222; color: #E7E2E1; font-family: Calibri, Candara, Segoe, "Segoe UI", Optima, Arial, sans-serif; letter-spacing: -0.6; text-shadow: -1px -1px #3D1408, 1px -1px #3D1408, -1px 1px #3D1408, 1px 1px #3D1408; }
body { margin: 0 auto; max-width: 350px; }
a { text-decoration: none; color: #E7E2E1; }
button { border: none; }
input { text-decoration: none; background: none; border: none; color: #E7E2E1; }
header { display: block; height: 47px; background: linear-gradient(to top, #921519, #57342E); padding: 3px 3px 3px 3px; box-shadow: 0 0 5px black; }
footer { display: block; height: 47px; background: linear-gradient(to bottom, #242424, #353535); padding: 3px 3px 3px 3px; border-top: 2px solid #57342E; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; box-shadow: 0 0 5px black; }
.game { padding: 7px; font-size: 14px; box-shadow: 1px 1px 1px #582E0F inset, -1px -1px 1px #582E0F inset, 0 0 5px black; background: #181818;  }
.field { background: #1F1F1F; margin: 3px; padding: 2px; box-shadow: 0 0 3px black; border: 1px solid #292929; text-align: right; }
.title { display: inline-block; background: #303030; font-size: 16px; padding: 4px 10px; border-top-left-radius: 5px; border-top-right-radius: 5px; }
.block { display: block; border: 1px solid #252525; padding: 5px; font-size: 14px; box-shadow: 2px 2px black, -2px -2px black, -2px 2px black, 2px -2px black, 3px 3px #3D3D3D, -3px -3px #3D3D3D, -3px 3px #3D3D3D, 3px -3px #3D3D3D, 4px 4px black, -4px -4px black, -4px 4px black, 4px -4px black; background: #080807; margin: 0 3px; }
.button { background: url('/img/style/button_left.png') no-repeat 0% 0%, url('/img/style/button_right.png') no-repeat 100% 0%, url('/img/style/button_center.png') repeat-x 0% 0%; height: 28px; padding: 5 10px 0; margin: 4px; display: inline-block; color: #FFF7C5; text-shadow: -1px -1px #3D1408, 1px -1px #3D1408, -1px 1px #3D1408, 1px 1px #3D1408; border-radius: 1px; }
.buttons { display: block; background: url('/img/style/buttons_left.png') no-repeat 0% 0%, url('/img/style/buttons_right.png') no-repeat 100% 0%, url('/img/style/buttons_center.png') repeat-x 0% 0%; padding: 3px 15px 8px 15px; margin: 3px 0px; }
.buttons img { display: inline-block; margin: -6px 0px -10px -10px; }
.no { opacity: .50; }
.notify { text-align: center; margin: 10px; }
.success { color: #b9deb9; }
.error { color: #deb9b9; }
.warning { color: #ded1b9;  }
.header_game { display: block; margin-top: -5px; padding: 5px; text-align: center; border-bottom: 1px solid #444444; background: linear-gradient(to top, #111111 0%, #333333 50%, #111111 100%) }
.header_res { display: inline-block; margin-left: 5px; padding: 1px 5px; width: 40%; transform: skew(-20deg); background: #1E0000; text-align: right; border: 1px solid #5E585D; text-shadow: -1px -1px 0 #3E1C01, 1px -1px 0 #3E1C01, -1px 1px 0 #3E1C01, 1px 1px 0 #3E1C01; font-size: 14px; }
.header_game img { display: inline-block; margin-bottom: -3px; }
.power { display: block; height: 200px; background-size: 100% 100%; border: 1px solid black; box-shadow: 0 0 50px black inset, 0 0 10px black; }
.p_text { display: block; background: #00000090; padding: 5px; border: 1px solid black; }
.profile { display: block; height: 450px; }
.params { display: block; border: 1px solid #412E28; border-radius: 1px; background: #120908; padding: 2px 5px; }
.tpower { font-size:19px; font-weight:bold; position: relative; text-shadow: -2px -2px 0 #000, 2px -2px 0 #000, -2px 2px 0 #000, 2px 2px 0 #000; color: black; }
.tpower:after{ content: attr(data-text); display: block; font-family: inherit; font-size: inherit; position: absolute; top:0; left:0; bottom: 0; right:0; background: linear-gradient(to top, darkred, red); -webkit-background-clip: text; color: transparent; text-shadow: none; }
.footer { display: block; padding: 5px; border-top: 1px solid #444444; border-bottom: 1px solid #444444; text-align: center; box-shadow: 0 0 5px #444444; text-shadow: 0 0 5px orange; box-shadow: 0 0 5px black; background: linear-gradient(to left, #33333350, #333333, #33333350) }
.footer img { display: inline-block; margin: -5px 2px; }
.info_bar { display: block; width: 100%; border-bottom: 1px solid #444444; }
.exp_bar { display: block; width: 100%; border: 1px solid #555555; height: 7px; background: black; box-shadow: 0 0 3px gray; border-radius: 5px; }
.exp_progress { display: inline-block; height: 7px; background: linear-gradient(to top, darkorange, yellow); border-radius: 5px; }
.btn_red { display: block; color: #bf0000; border: 3px solid black; border-radius: 5px; background: linear-gradient(to top, #2f0700, #7b1200); margin: 5px 7px; font-size: 20px; box-shadow: 1px 1px 1px #580000, -1px 1px 1px #580000, 1px -1px 1px #580000, -1px -1px 1px #580000; }
.btn_red img { display: inline-block; margin: 2px 1px -17px 5px; padding: 0 0 11 0; }
.btn_gray { display: block; border: 3px solid black; border-radius: 5px; background: linear-gradient(to top, #222222, #444444); margin: 5px 7px; font-size: 20px; box-shadow: 1px 1px 1px #333333, -1px 1px 1px #333333, 1px -1px 1px #333333, -1px -1px 1px #333333; }
.btn_gray img { display: inline-block; margin: 2px 1px -17px 5px; padding: 0 0 11 0; }
.titles { display: inline-block; font-size: 15px; background: url('/img/style/titles.png') center; text-shadow: 0 0 5px red; height: 30px; margin: -7px; line-height: 21px; width: 103.8%; }
.blocks { display: block; border: 3px solid black; margin: 7 0; background: #222222; border-radius: 5px; box-shadow: 1px 1px 1px #333333, -1px 1px 1px #333333, 1px -1px 1px #333333, -1px -1px 1px #333333; }
.battle_enemy { display: block; background: black; padding: 4px; border-top-right-radius: 20px; border-bottom-right-radius: 20px; }
.battle_enemy .img { display: block; float: right; margin: -21px -4px; border: 2px solid #222222; width: 38px; height: 38px; border-radius: 20px; box-shadow: 0 0 5px #333333; }
.battle_enemy .img img { border-radius: 20px; }
.battle_hero { display: block; background: black; padding: 4px 0 0 45px; margin-bottom: 5px; border-top-left-radius: 20px; border-bottom-left-radius: 20px; }
.battle_hero .img { display: block; float: left; margin: -23px -45px; border: 2px solid #222222; width: 38px; height: 38px; border-radius: 20px; box-shadow: 0 0 5px #333333; }
.battle_hero .img img { border-radius: 20px; }
.astral td { display: inline-block; background: #00000099; border: 1px solid black; border-radius: 3px; box-shadow: 0 0 5px black; margin: 2px; color: #51a9ff; }
table.shop { display: block; margin: 5px; padding: 3px; border: 1px solid black; box-shadow: 1px 1px 0 #74613D, -1px 1px 0 #74613D, 1px -1px 0 #74613D, -1px -1px 0 #74613D, 2px 2px 0 black, -2px 2px 0 black, 2px -2px 0 black, -2px -2px 0 black; background: linear-gradient(to bottom, #1B284100, #1D222D); }

.darkred { color: #bf0000; }
.i { display: inline-block; }