* { margin: 0; padding: 0; text-decoration: none; }

body { -webkit-text-size-adjust: none; -webkit-user-select: none; font: 13px Helvetica, Arial, sans-serif; }

#container { position: absolute; left: 50%; top: 50%; width: 500px; height: 350px; margin: -220px 0 0 -250px; }

h1 { margin-left: 138px; width: 225px; height: 110px; margin-bottom: 40px; cursor: pointer; position: relative; }
h1 a { display: none; color: #b7c2cf; position: absolute; right: -25px; top: 14px; font-size: 13px; border-left: 1px solid #dae2e9; height: 30px; padding: 16px 0 0 8px; opacity: 0.5; }
h1:hover a { display: block; }
h1:active a { opacity: 1; }
h1 span { color: rgba(0,0,0,0); display: block; height: 100%; background-position: center center; background-image: url('/static/images/logo.png?1253284995'); background-repeat: no-repeat; }

.em { font-weight: bold; }

#box { background: #ecf2f8 url('/static/images/box.png?1253284995') left top repeat-x; -webkit-border-radius: 8px; -moz-border-radius: 8px; padding: 30px 40px; position: relative; }

#input { background: rgba(255,255,255,0.5); padding: 1px; position: relative; }
#input .icon { background: transparent url('/static/images/icon_sprite.png?1253284995') 0 0 no-repeat; position: absolute; width: 23px; height: 23px; top: 10px; left: 10px; opacity: 0.5; }
#input .icon.error { background-position: 0 -46px; }
#input .icon.loading { background-position: 0 -23px; }
#input input { outline: 0; border: 1px solid #dae2e9; background: white url('/static/images/field.png?1253284995') left top repeat-x; -webkit-appearance: textfield; font: 19px 'HelveticaNeue-Light', "Helvetica Neue Light", "Helvetica Neue", "Helvetica", Arial, sans-serif; font-weight: 300; color: #363d42; width: 343px; padding: 6px 38px 6px 35px; }
#input input.example { font-style: italic; color: #cdd6de; }
#input input:focus { border-color: #cdd6de; -webkit-box-shadow: 0 0 20px white; -moz-box-shadow: 0 0 20px white; }

#lang { position: absolute; right: 49px; top: 39px; font-size: 13px; font-weight: bold; padding: 3px 5px; -webkit-border-radius: 3px; -moz-border-radius: 3px; color: #b7c2cf; cursor: pointer; }
#lang:hover { background: #b7c2cf; color: white; }
#lang:active { background: #939fad; }

#method { text-align: center; margin-top: 30px; }
#method a { padding: 3px 6px; margin: 0 2px; cursor: pointer; color: #939fad; -webkit-border-radius: 3px; -moz-border-radius: 3px; text-transform: lowercase; }
#method a.active, #method a:hover { background: #b7c2cf; color: white; }
#method a:active { background: #939fad; }

#info { position: absolute; right: 10px; bottom: 10px; }

#toggleInfo { position: absolute; right: 0; bottom: 0; background: url('/static/images/info.png?1253284995'); width: 16px; height: 16px; color: rgba(0,0,0,0); opacity: 0.2; cursor: pointer; }
#toggleInfo:hover { opacity: 0.5; }
#toggleInfo:active { opacity: 0.7; }

.weltip { z-index: 500; display: none; background: transparent url('/static/images/white_arrow_big.png?1243482282') scroll no-repeat; font-size: 12px; height: 166px; width: 320px; padding: 25px; color: #000; }
.weltip.comingsoon { font-weight: bold; text-align: center; font-size: 24px; line-height: 140px; }
.weltip .loading { background: transparent url('/static/images/spinner.apng?1252503156') scroll no-repeat 50% center; width: 100%; height: 80%; }

#weltip_top div { height: 115px; overflow-y: auto; overflow-x: hidden; }
#weltip_top div ol { list-style-position: inside; }
#weltip_top div a, #weltip_top div a:link, #weltip_top div a:visited { color: #555; }
#weltip_top div a:hover, #weltip_top div a:active, #weltip_top div a:link:hover, #weltip_top div a:link:active, #weltip_top div a:visited:hover, #weltip_top div a:visited:active { text-decoration: underline; }
#weltip_top ul { list-style: none; padding-bottom: 3px; border-bottom: 1px dotted #b7c2cf; overflow: hidden; }
#weltip_top ul li { display: inline; float: left; width: 33%; text-align: center; }
#weltip_top ul li a { padding: 3px 6px; margin: 0 2px; cursor: pointer; color: #939fad; -webkit-border-radius: 3px; -moz-border-radius: 3px; text-transform: lowercase; }
#weltip_top ul li a.active, #weltip_top ul li a:hover { background: #b7c2cf; color: white; }
#weltip_top ul li a:active { background: #939fad; }
#weltip_top ul li a { display: block; }

#infoBox { display: none; position: absolute; right: 13px; bottom: 13px; background: #ecf2f8 url('/static/images/box.png?1253284995') left top repeat-x; -webkit-border-radius: 8px; -moz-border-radius: 8px; padding: 10px 20px; width: 300px; font-size: 11px; line-height: 16px; color: #363d42; -webkit-box-shadow: 0 0 20px white; }
#infoBox h2 { font: 19px 'HelveticaNeue-Light', "Helvetica Neue Light", "Helvetica Neue", "Helvetica", Arial, sans-serif; font-weight: 300; margin: 3px 0 10px 0; color: #939fad; }
#infoBox strong { font-family: "Helvetica Neue", "HelveticaNeue", "Helvetica"; }
#infoBox p { margin: 5px 0; }
#infoBox .source { color: #939fad; }
#infoBox .source a { color: #74889e; border-bottom: 1px solid #d6e0ea; }
#infoBox .source a:hover { color: #363d42; border-bottom: 1px solid #939fad; }
#infoBox hr { margin: 10px -20px; border: 0; border-top: solid 1px #d6e0ea; border-bottom: 1px solid white; }
#infoBox #corner { position: absolute; background: url('/static/images/info_corner.png?1253284995'); height: 24px; width: 24px; right: -13px; bottom: -13px; }

#sugs { display: none; position: absolute; background: rgba(255,255,255,0.8); border: 1px solid #dae2e9; border-top: 0; left: 41px; top: 68px; right: 41px; list-style: none; padding: 3px 0; font-size: 11px; -webkit-border-bottom-left-radius: 5px; -webkit-border-bottom-right-radius: 5px; -moz-border-bottom-left-radius: 5px; -moz-border-bottom-right-radius: 5px; }
#sugs li.active a { background: #b7c2cf; color: white; }
#sugs li a:active { background: #939fad; }
