body {min-width:800px; margin:0; padding:0; background:url(../i/bg.png) repeat-x 50% 0 #000; font-family:arial, tahoma, sans-serif; font-size:12px; color:#b9b9b9}

table, img, a {border:0}

#top {width:80%; height:100px; min-width:780px; max-width:1100px; margin:0 auto; position:relative; z-index:2}
#top img {display:block; position:absolute; top:15px; left:10px; z-index:2}
#top h1 {font-size:1.55em; font-weight:normal; position:absolute; top:45px; right:0; margin:0; text-align:right; color:#a3a3a3}

#main {width:80%; min-width:780px; max-width:1100px; margin:0 auto; position:relative; overflow:hidden; background:#242424}
#main.bn {background:none}

.c_main {width:100%; height:100%}

.dn {display:none}
.db {display:block}
#main .bn {background:none}

.controls {width:100%; height:65px; position:relative; overflow:hidden; z-index:2}

.control {height:45px; margin:10px; float:right; position:relative; overflow:hidden; font-weight:bold; background:#000}
.control .color {width:28px; height:28px; font-size:0; line-height:0; float:left; background:url(../i/color_current.png) no-repeat 0 0 #017ac5; margin:8px 15px 8px 8px; position:relative; z-index:2; cursor:pointer}
.control .color span {display:none}
.control p {float:left; margin:15px 7px 15px 15px; position:relative; z-index:2}
.control canvas {z-index:1}

.colors {}
.colors .set {float:left; overflow:hidden; font-size:0; line-height:0; margin:12px 15px 12px 0; position:relative; z-index:2}
.colors .set a {width:10px; height:20px; float:left; background:url(../i/color_set.png) no-repeat 0 0 #eb3a05; margin-right:4px}
.colors .set span {display:none}
.colors .set .current {cursor:default}

.sizes {padding-right:9px}
.sizes a {display:block; border:1px solid #454545; text-decoration:none; color:#444; font:8px tahoma, sans-serif; float:left; text-align:center; margin-right:6px; position:relative; z-index:2}
.sizes span {display:block; margin:1px; color:#444}
.sizes .x32 {width:32px; height:32px; margin-top:5px}
.sizes .x32 span {width:30px; height:30px; line-height:30px}
.sizes .x24 {width:24px; height:24px; margin-top:9px}
.sizes .x24 span {width:22px; height:22px; line-height:22px}
.sizes .x16 {width:16px; height:16px; margin-top:13px}
.sizes .x16 span {width:14px; height:14px; line-height:14px}
.sizes .current {border-color:#747474; color:#fff; cursor:default}
.sizes .current span {background:url(../i/bg_size.png); color:#fff}

.backgrounds {}
.backgrounds .color {background-color:#fff; font-size:0; line-height:0}

.picker {position:absolute; top:20px; left:30px; z-index:5; background:#f00; float:none; clear:both}

.icons {clear:both; margin:0 10px; background:#fff; position:relative; z-index:2}
.icons .set {overflow:hidden; padding:3px; min-height:300px; position:relative; z-index:2}
.icons .set div {width:7.1%; height:60px; float:left; text-align:center; line-height:100px; position:relative; z-index:2; /*border-top:1px solid #515151; border-right:1px solid #414141; border-bottom:1px solid #414141; border-left:1px solid #515151*/}
.icons .set div.hidden {border:1px dashed #ccc; -moz-box-sizing:border-box}
/*.icons .set img {position:absolute; display:block; top:0; bottom:0; left:0; right:0; margin:auto}*/
.icons .set img {z-index:2; /*display:inline; vertical-align:middle;*/ /*margin:auto*/}
.icons .set img, .icons .set div canvas {position:absolute; top:50%; left:50%}
.icons .set div canvas {width:32px; height:32px; margin:-16px 0 0 -16px}

.icons .s32x32 img {/*width:32px; height:32px;*/ /*position:relative; z-index:2;*/ /*margin-top:44px*/}
.icons .s32x32 img {width:32px; height:32px; margin:-16px 0 0 -16px}
.icons .s24x24 img {width:24px; height:24px; margin:-12px 0 0 -12px}
.icons .s16x16 img {width:16px; height:16px; margin:-8px 0 0 -8px}

.icons .i_main {width:100%; height:100%; min-width:760px; z-index:1}

.load {visibility:hidden}

.menu {height:70px; font-size:0.9em; margin:11px 10px 0 0; padding:0; list-style:none; overflow:hidden; float:right; position:relative; z-index:2}
.menu li {margin:15px 0 0 10px; padding:8px 14px; float:left; position:relative}
.menu li:first-child {margin-left:0}
.menu a {display:block; color:#b9b9b9; text-decoration:none; min-height:16px; padding:1px 0 0 20px}
.menu a:hover {color:#888}
.menu .what {background:url(../i/p_what.png) no-repeat 0 0}
.menu .how {background:url(../i/p_how.png) no-repeat 0 0; padding-top:2px}
.menu .download {padding-right:10px; padding-bottom:7px}
.menu .download a {position:relative; z-index:2; padding:0 20px 0 0; font-size:1.1em; font-weight:bold; background:url(../i/p_download.png) no-repeat 100% 50%}
.menu .download a:hover {color:#fff; background-image:url(../i/p_download_h.png)}


#hints {width:360px; height:88px; position:relative; float:left; z-index:2; margin:-5px 0 -3px 10px; overflow:hidden}
#hints img {position:absolute; top:100%; left:10px; z-index:2}
#hints img.worm {width:115px; height:88px; top:15px; background:url(../i/c_worm_hands.png) no-repeat 0 0; z-index:2}
#hints img.add {width:115px; height:85px; top:0; background:url(../i/c_worm.png) no-repeat 0 90px; z-index:1}
#hints img.mole {width:134px; height:77px; top:8px; left:auto; right:0; background:url(../i/c_mole.png) no-repeat 0 0}
#hints img.dn {display:none; top:0}

#h_text {width:200px; height:60px; position:absolute; top:0; left:0; color:#555; padding:5px 15px}
#h_text p {height:100%; line-height:53px; position:relative; z-index:2; color:#333; text-align:center; vertical-align:middle}
#h_text p span {display:inline-block; line-height:12px; vertical-align:middle}

.nh #hints {display:none}

/*#h_text canvas {margin-top:-11px}
#h_text canvas.left {margin-left:-27px}
#h_text canvas.right {margin-left:-11px}*/

div.worm {margin:14px 18px 0 113px}
div.worm canvas.left {display:block}
div.worm canvas.right {display:none}
div.worm p {margin:2px 0 0 15px}

div.mole {margin:14px 18px 0 3px}
div.mole canvas.left {display:none}
div.mole canvas.right {display:block}
div.mole p {margin:2px 15px 0 0}

#what_tip {width:383px; height:395px; z-index:3}
#what_tip canvas {margin:-34px 0 0 -9px}
#what_tip img {position:relative; z-index:2}
#what_tip p {position:relative; z-index:2; margin:14px; color:#262626}
#what_tip p.tip_head {position:absolute; top:0; left:0; margin:-20px 0 0 8px; z-index:2; color:#959595; font-size:0.9em}
#what_tip div.tip_close {width:14px; height:14px; position:absolute; top:0; left:100%; z-index:3; margin:-20px 0 0 -19px; cursor:pointer}
#what_tip input.tip_close {position:relative; z-index:2; margin:20px auto 0; display:block}

#how_tip {width:383px; height:250px; z-index:3}
#how_tip canvas {margin:-34px 0 0 -9px}
#how_tip img {position:relative; z-index:2}
#how_tip p, #how_tip ul {position:relative; z-index:2; margin:14px; color:#262626}
#how_tip p.tip_head {position:absolute; top:0; left:0; margin:-20px 0 0 8px; z-index:2; color:#959595; font-size:0.9em}
#how_tip div.tip_close {width:14px; height:14px; position:absolute; top:0; left:100%; z-index:3; margin:-20px 0 0 -19px; cursor:pointer}
#how_tip input.tip_close {position:relative; z-index:2; margin:20px auto 0; display:block}

#how_tip ul {margin-left:31px; padding-left:0}
#how_tip ul li {margin:5px 0; padding-left:0; line-height:1.3em}

#about {width:90%; position:absolute; top:40px; left:5%; z-index:1; overflow:hidden}
#about h2 {font-size:2.1em; text-align:center; font-weight:normal; color:#5f5f5f; margin:170px 0 15px}
#about h2 strong {font-size:1.8em; font-weight:normal; color:#fff}
#about p {width:42%; float:left; line-height:1.7em; margin-left:5%}
#about p.r {float:right; margin-right:5%; margin-left:0}

#media, #footer {width:80%; min-width:780px; max-width:1100px; margin:0 auto; position:relative; border-bottom:1px solid #161616}

#media {padding:20px 0 10px; z-index:10}
#media div {padding-top:1px}
#media p {font-size:0.9em; color:#4d4d4d}
#media img {float:left; cursor:pointer}
#media .cl {clear:both; line-height:0; font-size:0}

#media .video {width:305px; float:left}
#media .video img {float:left}
#media .video p {margin-top:10px; margin-left:100px}
#media .video p.arr_l {background:url(../i/arr_l.gif) no-repeat 0 50%; padding-left:14px}
#media .video p.arr_r {background:url(../i/arr_r.gif) no-repeat 100% 50%; padding-right:14px; text-align:right}

#media .funs {margin-left:315px}
#media .funs p {margin-top:0; margin-left:80px; line-height:1.2em}
#media .funs a {color:#4d4d4d}
#media .funs a:hover {color:#999}
#media .funs span {display:block; margin-top:0.6em}
#media .funs img {margin-right:5px}

#video, #funs {display:none}
#video_tip {width:650px; height:440px; top:-415px; left:-9px; z-index:10}
#video_tip .obj {position:relative; z-index:5; margin:45px}
#video_tip embed {}

#funs_tip {width:320px; height:280px; top:-255px; left:315px; margin-left:-132px}
#funs_tip img {position:relative; z-index:5; display:block; margin:25px 25px 10px; clear:both; cursor:default}
#funs_tip ul {width:auto; list-style:none; margin:0 35px; padding:0; font-size:1em; color:#707070; position:relative; z-index:5; /*overflow:hidden;*/}
#funs_tip li {width:47%; margin:0 0 15px 0; padding:0; float:left}
#funs_tip li.r {margin-right:0; float:right}
#funs_tip a {color:#707070}

#media .tip_close {min-height:15px; position:absolute; top:20px; right:20px; z-index:10; cursor:pointer; background:url(../i/p_close.gif) no-repeat 100% 50%; padding-right:20px}

#footer {padding:20px 0 25px; overflow:hidden}
#footer p {font-size:7px; line-height:7px; float:right; color:#4d4d4d; text-transform:uppercase; text-align:right; margin:0; position:relative; padding-right:108px}
#footer p a {color:#fff; font-style:italic; text-transform:none}
#footer img {display:block; position:absolute; top:0; right:2px}

#footer ul {list-style:none; margin:0; padding:0; float:left; overflow:hidden; font-size:0.9em; color:#4d4d4d}
#footer li {margin:0 40px 0 0; padding:0; float:left; position:relative}
#footer a {display:block; color:#4d4d4d; text-decoration:none; min-height:16px; line-height:16px; padding-top:1px}
#footer a:hover {color:#999}
#footer a.contact {background:url(../i/p_mail.png) no-repeat 0 50%; padding-left:21px}
#footer a.twitter {background:url(../i/p_twitter.gif) no-repeat 0 50%; padding-left:18px}
#footer a.facebook {background:url(../i/p_facebook.gif) no-repeat 0 50%; padding-left:18px}

#preload {width:200px; height:20px; border:1px solid #ddd; background:#fff; position:absolute; top:50%; left:50%; margin:-10px 0 0 -100px; z-index:3; overflow:hidden}
#preload div {width:100%; height:20px; position:absolute; top:0; left:0; background:#aaa}

#plug {width:670px; height:65px; position:absolute; top:0; right:0; z-index:5}

#loader {width:64px; height:149px; position:absolute; top:0; left:50%; z-index:5; margin-left:-32px; overflow:hidden}
#loader img {position:absolute; left:0}
#loader .carrot {width:100%; height:68px; top:0; left:0; background:url(../i/preloader.png) no-repeat 0 0; z-index:2}
#loader .main {width:100%; height:81px; bottom:0; background:url(../i/preloader.png) no-repeat 0 -68px; z-index:2}
#loader .juice {width:100%; height:56px; position:absolute; top:100%; left:0; z-index:1; background:#ff8c00}
#loader .juice img {width:100%; height:2px; top:-2px; background:url(../i/preloader.png) no-repeat 0 100%}
#loader span {display:block; width:100%; position:absolute; left:0; bottom:15px; z-index:3; color:#fff; font-size:9px; text-align:center}

#overlay {width:100%; height:100%; position:absolute; top:0; left:0; z-index:10; background:#000}

#help {width:100%; min-width:800px; position:absolute; top:0; left:0; z-index:11}
#help div.main {width:80%; min-width:780px; max-width:1100px; min-height:550px; margin:0 auto; position:relative}
#help div.main .center {min-height:550px; position:relative; margin:0 13px}
#help div.main .center div {position:absolute; color:#3e3e3e}
#help div.main img {width:40px; height:41px; position:absolute; top:22px; left:21px; z-index:2; background:url(../i/p_help.png) no-repeat 0 0}
#help div.main p {font-size:12px; color:#363636; position:relative; z-index:2; margin:20px 20px 15px 75px}

#help div.dn div {display:none}

#help div.hcolor {width:285px; height:92px; top:30px; right:0; margin-right:-119px}
#help div.hcolor img {background-position:0 0}
#help div.hsize {width:340px; height:92px; top:145px; right:0; margin-right:-170px}
#help div.hsize p {margin-top:27px}
#help div.hsize img {margin-top:7px; background-position:0 -41px}
#help div.hicon {width:285px; height:92px; top:210px; left:24.8%; margin-left:-143px}
#help div.hicon img {background-position:0 -82px}
#help div.hok {width:365px; height:85px; top:350px; right:0; margin-top:-88px; cursor:pointer}
#help div.hok img {left:auto; right:21px; background-position:0 -123px}
#help div.hok p {height:85px; line-height:85px; font-size:14px; /*margin:34px 75px 15px 20px;*/ margin:0 75px 0 20px; text-align:right}
#help div.hok span {line-height:14px; display:inline-block; vertical-align:middle}

.chrome .icons .set div {}
.chrome #hints {margin-top:0}
.chrome #hints canvas {background:#242424}
.chrome #hints img.mole {z-index:2}
.chrome #hints img.add {background-color:#242424}

.chrome .menu {margin-top:15px}

.trident #hints canvas {background:#242424}
.trident #hints img.mole {z-index:2}
.trident .icons .set div {width:9.9%/*; background:#fff*/}
.trident .icons .set div img {margin:0; top:0; left:0; position:relative; z-index:2}

.trident .icons .set div a, .trident .icons .set div span {display:block; position:absolute; top:50%; left:50%; z-index:1}
.trident .icons .set div span img {position:static}

.trident .icons .s32x32 a, .icons .s32x32 span {width:32px; height:32px; margin:-16px 0 0 -16px}
.trident .icons .s24x24 a, .icons .s24x24 span {width:24px; height:24px; margin:-12px 0 0 -12px}
.trident .icons .s16x16 a, .icons .s16x16 span {width:16px; height:16px; margin:-8px 0 0 -8px}

.trident .icons .s32x32 span img {width:32px; height:32px}
.trident .icons .s24x24 span img {width:24px; height:24px}
.trident .icons .s16x16 span img {width:16px; height:16px}

#e404 {width:80%; min-width:780px; max-width:1100px; height:500px; margin:0 auto; position:relative; overflow:hidden; background:#242424}
#e404 h2 {font-size:3em; text-align:center; color:#5f5f5f; margin:150px 0 15px}
#e404 p {font-size:1.8em; font-weight:normal; color:#fff; margin:20px 40px; text-align:center}
#e404 a {color:#b9b9b9}
