.container{
   	overflow-y: hidden;
    overflow-x: hidden;
}
/*happy office*/
#happy_office_background{
	z-index: 9;
	width:100%;
	min-width: 910px;
	height:100%;
	position: fixed;
	background: url(../images/happy-office/building-bg.jpg) no-repeat center center fixed; 
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
#happy_office_background_mask{
	z-index: 10;
	width:100%;
	min-width: 910px;
	height:100%;
	position: fixed;
	background: #8A0F29;
	background-color: rgba(140, 15, 43, 0.5);
}
.ball_container{
	overflow: hidden;
	width:910px;
	margin: 0 auto;
}
.ball_pixel{
	position: absolute;
	width:55px;
	height:67px;
	background-image: url(../images/happy-office/pixels.png);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	margin-top: 350px;
}
#ball_pixel1{
	margin-left: -10px;
}
#ball_pixel2{
	margin-left: 245px;
}
#ball_pixel3{
	margin-left: 500px;
}
#ball_pixel4{
	margin-left: 755px;
}
.ball {
	width: 148px;
	height: 147px;
	margin-top:360px;
	position: absolute;
	z-index: 9998;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}
.ball_big{
	background-size: initial;
}
#ball1{
	background-position: -30px -7px;
	margin-left:25px;
	background-image: url(../images/happy-office/happy-1-ball.png);
}
#ball2{
	background-position: -13px -19px;
	margin-left:280px;
	background-image: url(../images/happy-office/happy-2-ball.png);
}
#ball3{
	background-position: -23px -19px;
	margin-left:535px;
	background-image: url(../images/happy-office/happy-3-ball.png);
}
#ball4{
	background-position: -23px -19px;
	margin-left:790px;
	background-image: url(../images/happy-office/happy-4-ball.png);
}
#ball1a{
	cursor: pointer;
	margin-left:110px;
	margin-top: -30px;
	background-image: url(../images/happy-office/happy-1.png);
}
#ball2a{
	cursor: pointer;
	margin-left:300px;
	margin-top: -30px;
	background-image: url(../images/happy-office/happy-2.png);
}
#ball3a{
	cursor: pointer;
	margin-left:490px;
	margin-top: -30px;
	background-image: url(../images/happy-office/happy-3.png);
}
#ball4a{
	cursor: pointer;
	margin-left:680px;
	margin-top: -30px;
	background-image: url(../images/happy-office/happy-4.png);
}
#ball1a.active{
	background-image: url(../images/happy-office/happy-1-on.png);
}
#ball2a.active{
	background-image: url(../images/happy-office/happy-2-on.png);
}
#ball3a.active{
	background-image: url(../images/happy-office/happy-3-on.png);
}
#ball4a.active{
	background-image: url(../images/happy-office/happy-4-on.png);
}
.happy_office_content_mask{
	width: 100%;
	min-width: 960px;
	position: fixed;
	height: 265px;
	overflow: hidden;
	bottom:0;
	/*z-index: 0;*/
	z-index: 99999;
	/*display: none;*/
}
.happy_office_content_mask_upgrade{
	height: 360px;
	display: block;
}
.happy_office_content_container{
	width: 100%;
	background-color: #fff;
	position: relative;
	/*margin-top: 300px;*/
}
.happy_office_content_mask_upgrade .happy_office_content_container{
	margin-top: 460px;
}
.happy_office_content_inner{
	color: #999;
	width: 450px;
	height: 275px;
	margin: 0 auto;
	background-color: #fff;
	padding: 30px 0;
}
#start_btn_bg{
	cursor: pointer;
	margin-top: -90px;
	margin-left: 114px;
	position: absolute;
	width:195px;
	height:196px;
	background-image: url(../images/upgrade-office/start-btn-bg.png);
}
#start_btn_dot{
	margin-top: 34px;
	margin-left: 33px;
	position: absolute;
	width:127px;
	height:127px;
	background-image: url(../images/upgrade-office/start-btn-dot.png);
}
#start_btn_word{
	margin-top: 49px;
	margin-left: 29px;
	position: absolute;
	width:68px;
	height:30px;
	background-image: url(../images/upgrade-office/start-btn-word.jpg);
}

.happy_office_content_title{
	position: absolute;
	top: 40px;
	left: 50%;
	margin-left: -187px;
	display: none;
}

#happy_office_content_ball1a .happy_office_content_title{
	position: absolute;
	width:351px;
	height:95px;
	/*background-image: url(../images/happy-office/happy_title_1.png);*/
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	margin-top: 10px;
	margin-left: 38px;
}
#happy_office_content_ball2a .happy_office_content_title{
	position: absolute;
	width:347px;
	height:95px;
	/*background-image: url(../images/happy-office/happy_title_2.png);*/
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	margin-top: 10px;
	margin-left: 42px;
}
#happy_office_content_ball3a .happy_office_content_title{
	position: absolute;
	width:351px;
	height:116px;
	/*background-image: url(../images/happy-office/happy_title_3.png);*/
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	margin-top: 10px;
	margin-left: 38px;
}
#happy_office_content_ball4a .happy_office_content_title{
	position: absolute;
	width:346px;
	height:74px;
	/*background-image: url(../images/happy-office/happy_title_4.png);*/
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	margin-top: 10px;
	margin-left: 41px;
}
.happy_office_content_detail{
    width: 100%;
    font-size: 14px;
    margin: 55px 0;
    line-height: 24px;
}

#scroll_bottom{
	width: 40px;
    height: 3px;
    position: absolute;
    margin-top: 675px;
    z-index: 9999;
}

.happy_office_intro_container{
	width: 500px;
	height: 500px;
	font-size: 20px;
	color: #fff;
	line-height: 100px;
	text-align: center;
	margin: 80px 223px;
	position: absolute;
	z-index:99;
	opacity: 0;
}
.happy_office_intro_container .intro_background{
	width: 100%;
	height: 100%;
	border-radius: 100%;
	background: #DA1E47;
	background-color: rgba(218, 30, 71,0.9);
}
.happy_office_intro_container .intro_title{
    width: 305px;
    height: 70px;
    position: absolute;
    margin-top: 90px;
    margin-left: 97px;
    background-image: url(../images/happy-office/happy_title.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.happy_office_intro_container .intro_content{
	width: 359px;
    height: 173px;
    position: absolute;
    margin-top: 190px;
    margin-left: 67px;
    background-image: url(../images/happy-office/happy_content.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.happy_office_intro_container .btn_intro_enter{
	width: 235px;
    height: 53px;
    position: absolute;
   	margin-top: 390px;
    margin-left: 127px;
    background-image: url(../images/happy-office/happy-button.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}

#happy_office_title{
	position: absolute;
	width:245px;
	height:53px;
	background-image: url(../images/happy-office/happy-office-title.png);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	margin-top: -120px;
	margin-left: 348px;
	top: 0;
}

#happy_office_title_container{
	opacity: 0;
}

#happy_office_title_image{
	width: 100px;
    height: 166px;
    position: absolute;
    margin-top: 170px;
    margin-left: 452px;
    background-color: yellow;
}
.upgrade_index_page#happy_office_title{
	border: none;
	width: 266px;
    height: 217px;
    position: absolute;
    margin-top: 155px;
    margin-left: 452px;
    background-image: url(../images/upgrade-office/upgrade-logo-white.png);
    opacity: 0;
}
#happy_office_msg{
	width: 493px;
    height: 50px;
    position: absolute;
    margin-top: 415px;
    margin-left: 340px;
    background-image: url(../images/upgrade-office/upgrade-intro.png);
    opacity: 0;
}
#happy_office_start_btn{
	position: absolute;
    width: 50px;
    height: 50px;
    background: green;
    z-index: 99999;
    margin-top: -59px;
}

#btn_start{
	cursor: pointer;
}