.ace-background-image {
	background-image: url(/img/primary/background/bg-1.jpg);
}
#content-wrapper{
	max-width: 1920px;
}
#content-wrapper .container-fluid{
	padding: 0;
	margin: 0;
	border-radius: 0;
	background: none;
}
.content-box{
	display: table;
	width: 100%;
}
.avatar-info{
	display: none;
	background-image: url(/gameworld/img/status-bg.png);
	background-position: top;
    max-width: 248px;
    margin: 127px auto 20px;
    padding: 0 0 30px;
	border: 3px solid #ffc679;
	border-radius: 10px;
}
.avatar-box{
	position: relative;
	margin: 25px auto 0;
	width: 160px;
	/*height: 160px;*/
}
.avatar-box>img{
	width: 160px;
	height: 160px;
	border: 3px solid #ffc679;
	border-radius: 50%;
	padding: 10px;
	background-color: #fff;
	margin-top: -125px;
}
.user-level-box {
	position: absolute;
    border: 3px solid #388370;
    border-radius: 50%;
    background-color: #388370;
    top: -5px;
    right: -5px;
    width: 48px;
    height: 48px;
    font-size: 24px;
    color: #fff;
    font-weight: 300;
    text-align: center;
    line-height: 42px;
}
#edit-profile {
	position: absolute;
    left: -10px;
    top: -18px;
}
#avatar-profile img{
	/*width: 55px;
    height: 55px;*/
}
#email {
	position: absolute;
    left: 20px;
    top: 10px;
}
#email img{
	/*width: 55px;
    height: 55px;*/
}
#edit-pet {
	position: absolute;
	top: -18px;
	right: -15px;
}
#avatar-edit img{
	width: 55px;
    height: 55px;
}
.avatar-name{
	text-align: center;
    color: #a66102;
    padding: 30px 5px 0;
    margin: 0 auto;
    font-size: 26px;
    font-weight: bold;
    font-family: 'Itim', cursive;
    text-shadow: 1px 1px 2px #fff;
	line-height: 1.2;
}
.avatar-name a{
	color: #a66102;
}
.avatar-level{
	margin: auto;
}
.avatar-level table{
	margin: auto;
}
.avatar-level table td{
	vertical-align: middle;
	color: #fff;
}
.avatar-level table .level-label{
	font-size: 22px;
	padding-right: 7px;
	text-shadow: 1px 1px 1px #666;
	line-height: 1;
    text-align: left;
}
.avatar-level table .level-text{
	font-size: 64px;
	font-weight: bold;
	text-shadow: 1px 2px 3px #666;
}
.xp-progress-box{
	padding: 0 15px;
}
.xp-progress-box:before{
  content: '';
  background:url('/img/primary/xp-coin.png');
  width: 57px;
  height: 53px;
  position: relative;
  z-index: 1;
  display: block;
}
.xp-progress-box .progress {
	position: relative;
	margin-top: -45px;
    margin-left: 45px;
    height: 36px;
    border-radius: 0;
	background-color: #8e5620;
	border: 3px solid #d28f3d;
}
.xp-progress-box .progress-bar{
	line-height: 30px;
	background-color: #9EFE00; 
	background-image: -webkit-gradient(linear, left top, left bottom, from(#9EFE00), to(#327200));
	background-image: -webkit-linear-gradient(top, #9EFE00, #327200);
	background-image: -moz-linear-gradient(top, #9EFE00, #327200);
	background-image: -ms-linear-gradient(top, #9EFE00, #327200);
	background-image: -o-linear-gradient(top, #9EFE00, #327200);
	background-image: linear-gradient(to bottom, #9EFE00, #327200);
	filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#9EFE00, endColorstr=#327200);
}
.xp-progress-box .progress-bar-title {
	position: absolute;
	text-align: center;
	line-height: 30px; /* line-height should be equal to bar height */
	overflow: hidden;
	color: #fff;
	right: 0;
	left: 0;
	top: 0;
}

.info-holder{
	margin-top: 20px;
	text-align: center;
}
.ace-coin-box {
	display: inline-block;
	margin-top: 10px;
}
.ace-coin img {
	position: relative;
    display: inline-block;
    z-index: 2;
}
#ace-points,
#cp-points{
	position: relative;
    display: inline-block;
    vertical-align: middle;
    border: 3px solid #ffc679;
    border-radius: 20px;
    background-color: #a66102;
    padding: 10px 20px;
    margin-left: -30px;
    line-height: 42px;
    font-size: 34px;
    text-align: center;
    color: #fff;
    z-index: 1;
    font-weight: bold;
	text-shadow: 1px 1px 1px #666;
}
#ace-points p,
#cp-points p{
	padding-left: 10px;
}
.badges-holder{
	max-width: 270px;
	margin: 40px auto 0;
}
.badges-title{
	text-align: center;
	background-color: #ff6666;
	color: #fff;
	line-height: 60px;
	font-size: 22px;
	border-top-left-radius: 26px;
	border-top-right-radius: 26px;
}
.badges-box{
	background-color: #5c604b;
	border-bottom-left-radius: 26px;
	border-bottom-right-radius: 26px;
}
.badges-table{
	display: table;
	width: 100%;
	padding: 10px;
}
.badges-row{
	display: table-row;
}
.badges-cell{
	display: table-cell;
	width: 33.33%;
	text-align: center;
	padding: 10px 0;
}
.badges-cell img{
	border: 5px solid #fff;
	width: 70px;
	height: 70px;
	border-radius: 50%;
	background-color: #fff;
}
.badges-viewall{
	text-align: center;
	color: #fff;
	font-size: 18px;
	padding-bottom: 20px;
}
.badges-viewall>.ace-button.btn-link{
	color: #fff !important;
}

.content-left{
	display: table-cell;
	width: 300px;
	vertical-align: top;
}
.content-right{
	display: table-cell;
	width: auto;
	vertical-align: top;
}
.right-content-box{
	max-width: 1363px;
	margin: auto;
	margin-top: -20px;
	padding-left: 10px;
	padding-right: 10px;
}
.shortcut-box{
	margin-left: -10px;
	margin-right: -10px;
}
.shortcut-box>div{
	padding-left: 10px;
	padding-right: 10px;
}
.content-cell{
	border: 2px solid #fff;
	margin-bottom: 20px;
}
.content-shortcut-box{
	position: relative;
}
.content-shortcut-message{
	position: absolute;
	width: 100%;
	text-align: center;
	bottom: 0;
	background-color: rgba(0,0,0,0.5);
	color: #fff;
	padding: 5px 0;
	font-size: 16px;
}
.math-game-world-box{
	margin-top: -10px;
}
.math-game-world-box>.math-game-world-img{
	/*border: 5px solid #fff;*/
	border-radius: 20px;
}
.math-game-world-box>.math-game-world-img img{
	border-radius: 20px;
}

.button-box{
	background-color: #999;
	text-align: center;
	padding: 5px 0;
	height: 45px;
}
.button-box .ace-button{
	font-family: 'Itim', cursive;
	font-size: 22px;
	border-radius: 0;
	padding: 1px;
	border: 1px solid #fff;
}
.timer-text{
	line-height: 35px;
    color: #fff;
}
.status-title {
	padding: 30px 35px 0;
	color: #006699;
	text-shadow: 1px 2px 3px #ccc;
	font-size: 32px;
}
.last-status-holder{
	padding: 0 20px;
}
.usage-graph-holder {
    padding: 0 10px;
}


#popupModal .modal-dialog{
	max-width: 1065px;
	width: 100%;
}
#popupModal .modal-content{
	border: 7px solid #ff9933;
}
#popupModal .modal-header{
	background: #ffcc33;
	background-image: url(/gameworld/img/modal-header-bg-pattern-l.png), url(/gameworld/img/modal-header-bg-pattern-r.png);
	background-position: left, right;
	background-repeat:no-repeat;
	border-top-right-radius: 0;
	border-top-left-radius: 0;
	border: none;
	padding: 7px 5px;
	border-bottom: 7px solid #ff9933;
}
#popupModal .modal-header .close{
	margin-top: -43px;
	margin-right: 10px;
}
#popupModal .modal-header .close:hover{
	opacity: 1;
}
#popupModal .modal-title{
	text-align: center;
	font-size: 32px;
	line-height: 53px;
	text-shadow: 1px 2px 3px #000000;
	font-family: 'Raleway', sans-serif;
	font-family: 'Itim', cursive;
	font-weight: 600;
}
#popupModal .modal-title img{
	display: inline-block;
}
#popupModal .modal-body{
	padding: 0;
	max-height: calc(100vh - 220px);
	overflow-y: scroll;
}
#popupModal #avatar {
	margin: 20px 0 10px 20px;
}
#popupModal #avatar img{
	border: none;
	cursor: pointer;
}
#popupModal #avatar ul li .thumbnail{
	margin-bottom: 0;
}
#popupModal .modal-body .info{
	text-align: center;
	background-color: #666;
	color: #fff;
	font-family: 'Raleway', sans-serif;
	font-size: 18px;
	padding: 7px 5px;
}
#popupModal .modal-body .petRoomContentHolder{
	width: 100%;
	height: 100%;
	background-color: #e7e7e7;
	background-image: url("/gameworld/img/pet-room-bg-pattern.png");
	background-repeat: repeat-x;
}
#popupModal .modal-body .petRoomTable{
	width: 100%;
	height: 100%;
	display: block;
}
#popupModal .modal-body .petRoomTableCell{
	display: block;
	vertical-align: top;
	width: 50%;
}
#popupModal .modal-body .selectedPetInfoBox{
	border-right: 2px solid #b6c8d3;
	width: 45%;
	float: left;
	overflow-y: auto;
	height: calc(100vh - 187px);
	-webkit-overflow-scrolling: touch;
	padding: 20px 15px;
}
#popupModal .modal-body .petsBox{
	padding: 5px 15px;
	width: 55%;
	overflow-y: auto;
	height: calc(100vh - 187px);
	-webkit-overflow-scrolling: touch;
}

#popupModal .modal-body .selectedPetInfoBox .ace-coin-box{
	display: block;
	padding-left: 20px;
	padding-right: 0;
	text-align: left;
}
#popupModal .modal-body .selectedPetInfoBox .ace-coin img {
	position: relative;
	display: inline-block;
	border: 2px solid #cde6ff;
	border-radius: 50%;
	background-color: #194877;
	z-index: 2;
	width: 42px;
	height: 42px;
	padding: 2px;
}
#popupModal .modal-body .selectedPetInfoBox .ace-coin .ace-points {
	position: relative;
	display: inline-block;
	width: 120px;
	vertical-align: middle;
	border: 2px solid #cde6ff;
	border-top-right-radius: 40px;
	border-bottom-right-radius: 40px;
	background-color: #194877;
	padding: 0 20px;
	margin-left: -23px;
	line-height: 32px;
	font-size: 26px;
	font-weight: 600;
	text-align: center;
	color: #fff;
	z-index: 1;
}
#popupModal .modal-body .petsBox .col-xxs-6,
#popupModal .modal-body .petsBox .col-xs-4, 
#popupModal .modal-body .petsBox .col-sm-4, 
#popupModal .modal-body .petsBox .col-md-3{
	padding-left: 10px;
	padding-right: 10px;
}
#popupModal .modal-body .petsBox .petsHolder .thumbnail{
	border-radius: 0;
	border: 2px solid #666;
	background-color: #f3dc73;
	padding: 10px;
	margin-bottom: 2px;
}
#popupModal .modal-body .petsBox .petsHolder .thumbnail>img, 
#popupModal .modal-body .petsBox .petsHolder .thumbnail a>img{
	max-width: 90%;
}
#popupModal .modal-body .petsBox .petsHolder .thumbnail.disabled{
	cursor: default;
	border: 2px solid #999;
	background-color: #666;
}
#popupModal .modal-body .petsBox .petsHolder .thumbnail.active{
	border: 4px solid #0fa71b;
	padding: 8px;
}

.status-content-holder{
	width: 80%;
}

#treasure-boxModal .modal-dialog{
	width: 300px;
}
#treasure-boxModal .modal-content{
	border: 5px solid #ff9933;
}
#treasure-boxModal .modal-header{
	background: #ffcc33;
	border-top-right-radius: 0;
	border-top-left-radius: 0;
	border: none;
	padding: 7px 5px;
	border-bottom: 5px solid #ff9933;
}
#treasure-boxModal .modal-header .close{
	margin-top: -37px;
	margin-right: 10px;
}
#treasure-boxModal .modal-header .close:hover{
	opacity: 1;
}
#treasure-boxModal .modal-title{
	text-align: center;
	font-size: 32px;
	line-height: 42px;
	text-shadow: 1px 2px 3px #000000;
	font-family: 'Raleway', sans-serif;
	font-family: 'Itim', cursive;
	font-weight: 600;
}
#treasure-boxModal .treasure-table{
	display: table;
	width: 100%;
	margin: 15px 0;
}
#treasure-boxModal .treasure-table-row{
	display: table-row;
}
#treasure-boxModal .treasure-table-cell{
	display: table-cell;
	width: 50%;
	text-align: center;
	vertical-align: bottom;
}

#treasure-boxModal .pet-holder>img{
	width: 100px;
	height: 100px;
	border-radius: 50%;
	border: 3px solid #f93;
	background-color: #ffcc33;
}
#treasure-boxModal .reward-text{
	font-size: 32px;
	line-height: 72px;
	font-weight: 600;
	color: #3e861b;
}
#treasure-boxModal .close-btn-holder{
	text-align: center;
	margin: 10px 0;
}
#treasure-boxModal .close-btn-holder .ace-button{
	font-size: 22px;
	padding: 4px 20px;
}

#reward-boxModal .modal-dialog{
	width: 300px;
}
#reward-boxModal .modal-content{
	border: 5px solid #ff9933;
}
#reward-boxModal .modal-header{
	background: #ffcc33;
	border-top-right-radius: 0;
	border-top-left-radius: 0;
	border: none;
	padding: 7px 5px;
	border-bottom: 5px solid #ff9933;
}
#reward-boxModal .modal-header .close{
	margin-top: -37px;
	margin-right: 10px;
}
#reward-boxModal .modal-header .close:hover{
	opacity: 1;
}
#reward-boxModal .modal-title{
	text-align: center;
	font-size: 32px;
	line-height: 42px;
	text-shadow: 1px 2px 3px #000000;
	font-family: 'Raleway', sans-serif;
	font-family: 'Itim', cursive;
	font-weight: 600;
}
#reward-boxModal .reward-table{
	display: table;
	width: 100%;
	margin: 15px 0;
}
#reward-boxModal .reward-table-row{
	display: table-row;
}
#reward-boxModal .reward-table-cell{
	display: table-cell;
	width: 100%;
	text-align: center;
	vertical-align: bottom;
}

#reward-boxModal .pet-holder>img{
	width: 100px;
	height: 100px;
	border-radius: 50%;
	border: 3px solid #f93;
	background-color: #ffcc33;
}
#reward-boxModal .reward-text{
	font-size: 32px;
	line-height: 72px;
	font-weight: 600;
	color: #3e861b;
}
#reward-boxModal .close-btn-holder{
	text-align: center;
	margin: 10px 0;
}





#timeChallengeModal .modal-dialog{
	max-width: 450px;
	width: 100%;
}
#timeChallengeModal .modal-content{
	border: 5px solid #ff9933;
}
#timeChallengeModal .modal-header{
	background: #ffcc33;
	border-top-right-radius: 0;
	border-top-left-radius: 0;
	border: none;
	padding: 7px 5px;
	border-bottom: 5px solid #ff9933;
}
#timeChallengeModal .modal-header .close{
	margin-top: -37px;
	margin-right: 8px;
}
#timeChallengeModal .modal-header .close:hover{
	opacity: 1;
}
#timeChallengeModal .modal-title{
	text-align: center;
	font-size: 32px;
	line-height: 42px;
	text-shadow: 1px 2px 3px #000000;
	font-family: 'Raleway', sans-serif;
	font-family: 'Itim', cursive;
	font-weight: 600;
}
#timeChallengeModal .timeChallengeModalContent{
	padding: 10px;
}
#timeChallengeModal .timeChallengeEasy{
	padding: 25px 0 0;
}
#timeChallengeModal .timeChallengeNormal{
	padding: 25px 0 0;
}
#timeChallengeModal .timeChallengeHard{
	padding: 25px 0 0;
}
#timeChallengeModal .timeChallengeModalContentTitle{
	color: #b3392c;
	padding-bottom: 5px;
	font-size: 24px;
    font-family: 'Itim', cursive;
    font-weight: 600;
}
#timeChallengeModal .timeChallengeModalContentText{
	color: #666;
	padding-bottom: 8px;
}
#timeChallengeModal .ace-button{
	padding: 0 20px;
}
#timeChallengeModal .close-btn-holder{
	text-align: center;
	margin: 10px 0;
}






.user-info-label{
	display: none;
	color: #333;
    padding: 5px;
    margin: 10px 10px -30px;
    line-height: 34px;
	font-size: 20px;
}
.toggleuserinfo.glyphicon {
	top: 6px;
	font-size: 22px;
	cursor: pointer;
}


.reward-table{
	display: table;
}
.reward-table-row{
	display: table-row;
}
.reward-table-cell{
	display: table-cell;
	padding: 5px 10px 5px 0;
}

/* Landscape phones and portrait tablets */	
@media screen and (max-width: 767px){
	.content-box {
		display: block;
	}
	.content-left {
		display: block;
		width: 100%;
	}
	.content-right {
		display: block;
		width: 100%;
	}
	.right-content-box{
		margin-top: 0px;
	}
	.badges-holder {
		max-width: 580px;
		margin: 40px auto 0;
		padding: 0 20px;
	}
	.user-info-label{
		/*display: block;*/
	}
	.navbar .nav > li {
		background: #fff;
	}
	.navbar-brand, .navbar-nav li a{
		line-height: 1;
	}
	.navbar .nav > li > a, .navbar .nav > li.current-menu-item > a, .navbar .nav > li.current-menu-ancestor > a {
		color: #333;
	}
	#popupModal .modal-dialog{
		margin-top: 0;
	}
	#popupModal .modal-body{
		overflow-y: auto;
		max-height: calc(100vh - 280px);
		-webkit-overflow-scrolling: touch;
	}
}

/* Portrait phones and smaller */
@media (max-width: 480px) {
	#popupModal #avatar {
		margin: 10px;
	}
}