@charset "utf-8";

@font-face {
	font-family:'Ubuntu R';  
	src: url('../font/Ubuntu-R.ttf'); 
}

html, body {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	position: relative;
	-webkit-user-select: none;  
  	-moz-user-select: none;    
  	-ms-user-select: none;      
  	user-select: none;
}

html {
	background-image: -webkit-radial-gradient(center, circle closest-side, rgba(0, 161, 255, 0.5) 0%, rgba(0, 0, 0, 0) 100%), url('../image/index_second/repeat_bg.png');
}

body {
	background: url('../image/general/backdrop/olympic/reception_backdrop_right.png') right bottom no-repeat, url('../image/index_second/vine1.gif') right top repeat-y/*, url('../image/index_second/gradient.png') fixed left bottom repeat-x*/;
}

.contextmenu {
	width: 206px; 
	background-color: #FFF; 
	position: fixed; 
	z-index: 999999; 
	display: none; 
	box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.8);
	border: 1px solid #EFEFEF;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	font-family: Verdana;
	font-size: 11px;
}

.contextmenu .cMenuItem {
	width: 176px; 
	padding: 8px 12px 8px 12px;
	margin: 2px 3px 1px 3px;
}

.contextmenu .cMenuItem:hover {
	cursor: pointer;
	background-color: #EDF7FC;
	padding: 7px 11px 7px 11px;
	border: 1px solid #EDF7FC;
	-webkit-border-radius: 2px;
	border-radius: 2px;
}

.balls {
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 0;
	background-image: url('../image/general/backdrop/newyear_2013/reception_backdrop_right.png');
	background-position: right top;
	background-repeat: no-repeat;
	display: none;
}

.container {
	width: 893px;
	z-index: 9999;
}

.loginContainer {
	width: 100%;
	margin: auto;
	background-color: rgba(42, 44, 45, 1);
	font-family: Myriad Pro;
	left: 0;
	top: 0;
	box-shadow: 0 3px 0 rgba(0, 0, 0, 0.3);
	border: 1px solid rgba(0, 0, 0, 0);
	border-radius: 3px;
}

.loginContainer.error {
	background-color: rgba(193, 0, 0, 1);
}

.loginContainer.error .second {
	color: #2E0102 !important;
}

.loginContainer .tree {
	position: absolute;
	background-image: url('../image/general/icons/tree.gif');
	width: 27px;
	height: 32px;
	top: -31px;
	left: 10px;
}

.loginContainer .cat {
	position: absolute;
	right: 10px;
	top: -39px;
	width: 48px;
	height: 48px;
	background-image: url('../image/general/avatars/animal/cat.png');
	z-index: 8;
}

.loginContainer .animatedButton {
	background-image: url('../image/general/base/animated_round.gif');
	width: 105px;
	height: 106px;
	position: absolute;
	top: -8px;
	right: 0px;
}

.loginContainer .smallTitle {
	font-family: Verdana;
	font-size: 12px;
	position: absolute;
	top: -22px;
}

.loginContainer .smallTitle.normal {
	left: 45px;
}

@media screen and (max-height: 636px) {
	/*.loginContainer .smallTitle {
		color: #fff;
	}*/
}

@media screen and (max-height: 596px) {
	.container {
		margin-top: 41px !important;
	}
}

.loginContainer .smallTitle.side {
	right: 67px !important;
}

.loginContainer .smallTitle a {
	color: #239CE4;
	text-decoration: none;
}

.loginContainer .smallTitle a:hover {
	text-decoration: underline;
}

.loginContainer .inside {
	margin: 15px;
	display: table;
}

.loginContainer .inside .left {
	width: 200px;
	float: left;
}

.loginContainer .inside .right {
	width: 150px;
	float: left;
	margin-left: 24px;
}

.loginContainer .inside .buttonContainer {
	float: left;
	margin-left: 24px;
	margin-top: 14px;
}

.loginContainer .inside .buttonContainer button {
	display: table;
	border: 1px solid #E6E6E6;
	background-color: #E6E6E6;
	border-radius: 4px;
	padding: 4px 20px 6px 20px;
	outline: none;
	resize: none;
	color: #666;
}

.loginContainer .inside .buttonContainer button:hover {
	cursor: pointer;
	background-color: #EFEFEF;
}

.loginContainer .inside .title {
	color: #FFF;
	font-size: 12px;
	padding-left: 2px;
}

.loginContainer .inside input {
	-webkit-transition: all 0.5s;
	width: 100%;
	border: 1px solid #FFF;
	background-color: #FFF;
	border-radius: 4px;
	padding: 5px;
	outline: none;
	resize: none;
}

.loginContainer .inside input:focus {
	border: 1px solid #73B8EE;
	box-shadow: 0 0 11px rgba(115, 184, 238, 8);
}

.loginContainer .inside .second {
	color: #3AAEED;
	font-size: 11px;
	padding-left: 2px;
}

.loginContainer .inside .second:hover {
	text-decoration: underline;
	cursor: pointer;
}

.loginContainer .inside .userCount {
	float: left;
	color: #FFF;
	font-family: Ubuntu R;
	font-size: 13px;
	text-shadow: 0 1px #000;
	-webkit-text-stroke: 0.1px;
	border-left: 1px solid #666;
	padding: 10px 10px 10px 20px;
	margin: 10px 10px 10px 20px;
}

.bigButton {
	-webkit-transition: all 0.3s !important;
	position: absolute;
	right: 6px;
	top: 8px;
	height: 65px;
	width: auto;
	border: 5px solid #B0811E;
	border-radius: 4px;
	background-color: #B0811E;
	box-shadow: 0 0 0 -3px #C7AE81, 0 0 0 3px #C7AE81, inset 0 35px 0 #ECB81C;
	color: #FFF;
	font-family: Verdana;
	font-size: 26px;
	padding: 0px 15px 0 15px;
	text-align: center;
	line-height: 120%;
}

.bigButton:hover {
	background-color: #C99224;
	box-shadow: 0 0 0 -3px #E0C391, 0 0 0 3px #E0C391, inset 0 35px 0 #F2C232;
	border: 5px solid #C99224;
	cursor: pointer;
}

.containment {
	width: 888px;
	height: 378px;
	background-image: url('../image/general/base/shop_base.gif');
	margin: 20px 0 0 1px;
	border: 3px solid #FFF;
	border-radius: 3px;
	position: relative;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
}

.containment .overlay {
	width: 827px;
	height: 215px;
	position: absolute; 
	left: 10px;
	top: 114px;
	background: rgba(255, 255, 255, 0.7);
	border-radius: 4px;
	z-index: 10;
	padding: 20px;
}

.containment .overlay .left {
	width: 300px;
}

.containment .overlay .left label:not(:first-child) {
	margin-top: 10px;
}

.containment .overlay label {
	display: table;
	font-family: Ubuntu R;
	color: #0056AD;
	-webkit-text-stroke: 1px;
}

.containment .overlay input {
	-webkit-transition: all 0.4s;
	width: 98%;
	border: 1px solid #999;
	border-radius: 3px;
	padding: 8px;	
	outline: none;
}

.containment .overlay input:focus {
	border-color: #009FFF;
	box-shadow: 0 0 5px rgba(0, 159, 255, 0.5);
}

.containment .bubble {
	background-image: url('../image/index_second/bubble.png');
	width: 115px;
	height: 65px;
	position: absolute;
	right: -15px;
	top: 80px;
	z-index: 2;
	font-family: Verdana;
	text-align: center;
}

.containment .bubble .count {
	font-weight: bold;
	font-size: 17px;
	padding-top: 5px;
}

.containment .bubble .second {
	font-size: 12px;
}

.containment .whiteContainer {
	width: 888px;
	height: 100px;
	background-color: #FFF;
	box-shadow: 0 3px 0 rgba(255, 255, 255, 0.5);
	position: absolute;
	background-image: url('../image/general/avatars/frank/frank_left_carpet.gif');
	background-repeat: no-repeat;
	background-position: 0 5px;
}

.containment .whiteContainer .upperTitle {
	color: #CC0704;
	font-weight: bold;
	font-size: 12px;
	margin: 5px;
}

.containment .whiteContainer .firstContainer {
	float: left;
	display: table;
	padding-right: 20px;
}

.containment .whiteContainer .secondContainer {
}

.containment .whiteContainer .secondContainer .bigTitle {
	font-size: 28px;
	color: #3C3C3C;
	font-family: Myriad Pro;
	font-weight: bold;
	text-align: center;
	padding-top: 20px;
}

.containment .whiteContainer .secondContainer blue {
	color: #239CE4;
}

.containment .whiteContainer .secondContainer .smallTitle {
	font-family: Verdana;
	font-size: 12px;
	text-align: center;
	padding-top: 2px;
}

.containment .whiteContainer .secondContainer .smallTitle a {
	color: #239CE4;
	text-decoration: none;
}

.containment .whiteContainer .secondContainer .smallTitle a:hover {
	text-decoration: underline;
}

.containment .whiteContainer .line {
	border-right: 1px solid #CCC;
	float: left;
	height: 60px;
	margin-top: 20px;
}

.containment .whiteContainer .newsItem {
	display: table;
	padding: 0 5px 5px 5px;
	font-size: 11px;
}

.containment .whiteContainer .newsItem:not(:first-child) {
	margin-top: 2px;
}

.containment .whiteContainer .newsItem .title {
	font-weight: bold;
	cursor: pointer;
}

.topBar {
	/*background: url('../image/general/base/corner_stars_left_top.png') left top fixed no-repeat, url('../image/general/base/background.png') repeat-x;*/
	height: 47px;
	width: 100%;
	position: fixed;
	z-index: 0;
}

#firstPlace.rightPlace {
	float: right;
}

.topBar .leftStatement {
	display: table;
	float: left;
}

.topBar .rightStatement {
	display: table;
	float: right;
}

.stars {
	width: 225px;
	height: 132px;
	background: url('../image/general/base/corner_stars_left_top.png') left top fixed no-repeat;
	position: fixed;
	z-index: 99998;	
}

.stars .firstLogo {
	margin: 8px 5px 0 5px; 
	float: left;
}

a.tooltip {
	position: relative;
	cursor: default;
	text-shadow: #090A0B 0 -1px;
}

a.tooltip > i {
	text-align: center;
	font: normal 12px Verdana;
	line-height: 150%;
	color: #333;
	text-shadow: white 0 1px;
	background: #DDD;
	background-clip: padding-box;
	box-shadow: 0 0px 2px rgba(0, 0, 0, 0.5);
	border: 5px solid #111;
	border: 5px solid rgba(0, 0, 0, 0.5);
	border-radius: 3px;
	position: absolute;
	width: 250px;
	left: 0%;
	margin-left: -250px;
	padding: 10px 0;
	bottom: 100%;
	margin-bottom: 15px;
	visibility:hidden;
	opacity:0;
	-webkit-transition: opacity 0.5s linear;
	-moz-transition: opacity 0.5s linear;
	-ms-transition: opacity 0.5s linear;
	-o-transition: opacity 0.5s linear;
	transition: opacity 0.5s linear;
}

a.tooltip.community_random_habbos > i {
	
}

a.tooltip.right-left > i {
	margin-left: -40px;
}

a.tooltip.left > i {
	margin-left: 0px;
}

a.tooltip.right > i {
	
}

a.tooltip > i:before, a.tooltip > i:after {
	content: "";
	position: absolute;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	top: 100%;
}

a.tooltip.left > i:before, a.tooltip.left > i:after {
	left: 15px;
}

a.tooltip.right-left > i:before, a.tooltip.right-left > i:after {
	right: 30px;
}

a.tooltip.right > i:before, a.tooltip.right > i:after {
	right: 5px;
}

a.tooltip > i:before {
	border-top: 10px solid #111;
	border-top: 10px solid rgba(0, 0, 0, 0.5);
	margin-top: 5px;
}

a.tooltip > i:after{
	border-top: 10px solid #DDD;
	margin-top: -2px;
	z-index: 1;
}

a.tooltip:hover > i {
	visibility: visible;
	opacity: 1;
}