* {margin:0; padding:0; list-style:none;font-size: 100%;}
h1, h2, h3, h4, h5, h6, strong, b {font-weight:normal;}
em, ins, dfn, del, i {font-style:normal;text-decoration:none;}
img {border:0;}
:focus {outline:0;}
html, body {
	height:100%;
	min-width:1000px;
}
body {
	background:url(i/body.jpg) repeat 50% 50%;
	font:normal 14px Helvetica, sans-serif;
	line-height:1.4;
	color:#4f4f4f;
	text-shadow:1px 1px 0 #fff;
}
.box {min-height:100%;background:url(i/body_box.png); background-attachment: fixed;}

.pip {float:left;}
.clearit {clear:both;font-size:0;height:1px;padding:0;overflow:hidden;width:100%;}

.wrap {
	overflow:hidden;
	min-height:1%; 
}

.wrapper:after, .store:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
div, .wrapper, .store {min-height:1%;}


.containerbox {
   width:1000px;padding-top:50px;
   margin:0 auto;
   background:url(i/container.png) no-repeat 0 50px;
}
.container {
   position:relative;
   height:751px;
   background:url(i/container.jpg) no-repeat 39px 66px;
}

.services {position:absolute;top:35px;right:56px;}
.services li {float:left;margin-right:17px;}
.services a {
   color:#696969;text-decoration:none;
   padding:6px 0 6px 34px;
   background:url(i/services.png) no-repeat 0 0;
}
.services a:hover {color:#8c8c8c;background-position:0 -38px;}
.services .twitter a {background-position:0 -76px;}
.services .twitter a:hover {background-position:0 -114px;}

.descript {
   padding:73px 0 0 291px;
   width:390px;height:434px;
   position:relative;
}
.descript h1, .descript a.h1 {display:block;height:72px;text-indent:-9999em;background:url(i/charadium.png) no-repeat 0 0;}
.descript h3 {color:#1d6caf;font-size:16px;height:60px;margin-right: -20px;}
.descript p {padding-bottom:12px;}
a.appstore {
   display:block;
   width:108px;height:36px;
   background:url(i/appstore.jpg) no-repeat 0 0;
   text-indent:-9999em;
}

.scroller {
   overflow:hidden;
   width:710px;height:194px;
   padding-top:13px;margin-left:56px;
   white-space:nowrap;
   position:relative;
}
.scroller li {   
   display:inline-block;
   width:154px;height:154px;
   margin-right:29px;
   vertical-align:top;
}
.scroller ul {padding-top:19px;}
.scroller li a {display:block;height:154px;}
.scroller ul.scroll_a {
   position:absolute;z-index:5;
   top:13px;left:0;
}
.scroller ul.scroll_img li {background:url(i/scroll_img.png) no-repeat 0 0;position:relative;}
.scroller ul.scroll_img li img {position:relative;z-index:3;}
.scroller ul.scroll_img li i {
	display: none;
}
.scroller ul.scroll_img li span.guess {
   position:absolute;
   left:11px;
   display:block;
   overflow:hidden;
   
   width:132px;
   height:19px;

   color:#fff;
   text-align:center;
   text-shadow:-1px -1px 1px #6e6e6e;
}

.scroller ul.scroll_img li span.guesstop {
   top:0px;
   height: 0px;
   -moz-border-radius-topleft:3px;
   -moz-border-radius-topright:3px;
   -webkit-border-top-left-radius:3px;
   -webkit-border-top-right-radius:3px;
}

.scroller ul.scroll_img li span.guessbtm {
   top:154px;
   height: 0;
   -moz-border-radius-bottomleft:3px;
   -moz-border-radius-bottomright:3px;
   -webkit-border-bottom-left-radius:3px;
   -webkit-border-bottom-right-radius:3px;
}

.scroller ul.scroll_img img {
	width: 154px;
	height: 154px;
	
	display:none;
}

.iphone {
   position:absolute;top:84px;left:41px;
   padding:67px 17px 69px 19px;
   
}
.iphone i {
   position:absolute;top:0;left:0;
   width:217px;height:405px;border:0;
   background:url(i/iphone.png) no-repeat 0 0;
}
.iphone p {width:180px;height:270px;overflow:hidden;}

.promo_pics {
   position:absolute;top:132px;right:58px;
   display:block;
   width:227px;height:328px;
}
img.promo_pics {z-index:2;}
a.promo_pics {
   z-index:4;
   opacity: 0;
   height:174px;
   padding-top:154px;
   background:url(i/promo_pics.png) no-repeat 29px 117px;

   color:#fff;font-size:15px;
   text-shadow:-1px 0 1px #000;
   text-decoration:none;
   text-align:center; text-indent:0;
}

/*.press {padding-left:210px;font-size:13px;}*/
.press {position: absolute; top: 710px; left:210px;font-size:13px;}
.press a, .press {color:#696969;text-decoration:none;}
.press a:hover {color:#8c8c8c;}
.footer {
   position:absolute;top:695px;right:20px;
   z-index:10;
   font-size:12px;
   color:#dddddd;
   text-align:right;
   text-shadow: -1px -1px 1px #000;
   line-height: 15px; margin-top: 5px;
}
.footer sup {
	font-size: 10px;
}
.footer a {
   color:#bdbdbd;
}

.paint {
   position:absolute;top:246px;right:7px;
   z-index:3;
   width:346px;height:474px;
   background:url(i/paint.png) no-repeat 0 0;
}
.paint2 {
   position:absolute;top:584px;left:26px;
   z-index:3;
   width:183px;height:151px;
   background:url(i/paint2.png) no-repeat 0 0;
}
.blue {background:#008fd1;}
.green {background:#25af00;}
.orange {background:#fe8200;}
.red {background:#a60005;}
.scroller ul.scroll_img li span.right {
	background: white;
	color: #41ad00;
	text-shadow: 1px 1px 1px #cdddc4;
	border: 1px solid #266400;
}

#overlay {
   position:absolute;top:0;left:0;right:0;bottom:0;
   z-index:300;
   background:url(i/overlay.png);
}
.popup {
   position:absolute;top:50%;left:50%;
   z-index:301;
   margin:-336px 0 0 -262px;
   width:524px;height:672px;
}
.popup a.next, .popup a.prev {
   position:absolute;top:229px;
   display:block;
   width:59px;height:59px;
   background:url(i/l_navi.png) no-repeat 0 0;
}
.popup a.prev {
   left:18px;
   background-position:0 0;
}
.popup a.prev:hover {background-position:0 -59px;}
.popup a.next {
   right:18px;
   background-position:-59px 0;
}
.popup a.next:hover {background-position:-59px -59px;}
.big_pic {
   position:absolute;top:3px;left:84px;
   padding:18px;width:320px;height:480px;
   background:url(i/big_pic.png) no-repeat 0 -1px;
}
.popup p {
   position:absolute;top:532px;left:0;
   width:100%;
   text-align:center;
}
.popup p a {
   display:inline-block;
   width:68px;height:102px;
   padding:9px;
   background:url(i/small_pic.png) no-repeat 0 0;
}
.popup p a.on {background-position:0 -120px;}

/* room number form */

form.roomnumber {
	position: absolute;
	left: 712px;
	top: 80px;
	
	width: 
	
	background: red;
}

form.roomnumber div.input {
	position: relative;
	
	width: 144px;
	height: 36px;
	background: url(i/input_bg.png) no-repeat 0px 0px;
}

form.roomnumber div.input input {
	background: none;
	border: none;
	
	position: absolute;
	left: 10px;
	top: 10px;
	
	width: 130px;
	
	text-align: center;
}

form.roomnumber input.placeholder {
	color: #808080;
}

form.roomnumber a {
	position: absolute;
	left: 144px;
	top: 0px;
	
	display: block;
	width: 91px;
	height: 36px;
	background: url(i/input_but.png) no-repeat 0px 0px;
	text-indent: -9999em;
}

form.roomnumber a:hover, form.roomnumber a:active {
	background: url(i/input_but.png) no-repeat 0px -36px;
}

div.invroom {
	position: absolute;
	left: 715px;
	top: 120px;
	z-index: 3;

	width: 144px;
	height: 50px;
	
	line-height: 50px;
	text-align: center;
	
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	
	text-shadow: none;
	
	background: black;
	background: rgba(0, 0, 0, 0.8);
	
	color: white;
	
	display: none;
}

/* on5 logo */

a.on5 {
	display: block;
	
	background-image: url(i/on5_logo_but.png);
	background-repeat: no-repeat;
	background-position-x: 0px;
	background-position-y: 0px;

	width: 70px;
	height: 41px;
	
	text-align: left;
	text-indent: -9999em;
	
	position: absolute;
	right: -10px;
	top: 10px;
}

a.on5:hover {
	background-position-y: -42px;
}


/* TEXT PAGE */
body.text {
	background:#fff;
	color:#373737;
	font:normal 12px Lucida Grande, Helvetica, sans-serif;
}
body.text a {
	text-decoration:underline;
	color:#373737;
}
body.text a:hover {color:#666;}
.itemcontainer {
	border-bottom:solid 1px #ebebeb;
	min-width:990px;
}
.itembox {
	width:715px;
	padding:30px 0;
	margin:0 auto;
}
body.text h1, body.text h2, body.text h3, body.text h4 {
	font-size:18px;
}
body.text h3 {padding-bottom:15px;}
body.text a.fr {float:right;margin-right:15px;font-size:12px;}
body.text p {
	padding:0 0 15px;
	width:95%;
}
body.text .hello {font-size:14px;}
.store {padding:10px 0;}
.store .pip {margin-right:15px;}
body.text .store p, body.text .hello p {padding-bottom:8px;}
.store .sell_services {
	float:right;
	width:330px;
	margin:0 20px 0 10px;
}
.store .sell_services li {
	display:inline-block;
	width:160px;
	padding:8px 0;
	vertical-align:top;
}
.store .sell_services a {padding:3px 0 3px 24px;}
.store .sell_services a.s_charadium {background:url(http://charadium.com/i/press/charadium.gif) no-repeat 0 50%;}
.store .sell_services a.s_facebook {background:url(http://charadium.com/i/press/facebook.gif) no-repeat 0 50%;}
.store .sell_services a.s_on-5 {background:url(http://charadium.com/i/press/on-5.gif) no-repeat 0 50%;}
.store .sell_services a.s_twitter {background:url(http://charadium.com/i/press/twitter.gif) no-repeat 0 50%;}

.video div {padding-bottom:15px;}
.video {font-size:14px;}
.video input {
	vertical-align:middle;
	border:solid 1px #d8d8d8;
	padding:2px;
	width:500px;
	color:#444;
	font:normal 13px Arial;
}
.screenshots .screenshots_items li p {padding-bottom:2px;}
.screenshots .screenshots_items li, .othermedia li {
	display:inline-block;
	width:49%;padding-bottom:50px;
	vertical-align:top;
}
.othermedia li {width:auto;padding-right:45px;}

.thanx {text-align:center;font-size:14px;}
.thanx h6 {font-size:28px;font-weight:bold;text-shadow:1px 1px 1px #ccc;}

/* Q announce */

div.qui {
	position: relative;
	margin: -65px auto 0 auto;
	
	padding-left: 620px;
	
	width: 264px;
	
	z-index: -1;
}

a.qui {
	display: block;
	
	background-image: url(i/newGameQ.png);
	background-repeat: no-repeat;
	background-position-x: 0;
	background-position-y: 0;

	width: 264px;
	height: 88px;
	
	text-align: left;
	text-indent: -9999em;
}

a.qui2 {
	display: block;
	
	text-indent: -9999em;
	text-align: left;
	
	position: absolute;
	
	left: -100px;
	top: -10px;
	
	z-index: -1;
	
	width: 200px;
	height: 70px;
}

/* ngmoco:) */

.logoRed {
	color: red;
}

.logoBlue {
	color: #06f;
}