@font-face { font-family: 'Boogaloo'; src: url('../fonts/Boogaloo-Regular.otf'); }
@font-face { font-family: 'Scoreboard'; src: url('../fonts/scoreboard.ttf'); }

body {
	text-align: center;
	padding:0;
	margin: 0;
	font-family: Boogaloo;
	text-transform: uppercase;
	font-size: 50px;
	color: white;
}

h1 {
	font: 120px Boogaloo;
	color: white;
	text-shadow: 8px 8px 0 black;
	margin-top: 30px;
}

h2 {
	font: 80px Boogaloo;
	color: white;
	text-shadow: 4px 4px 0 black;
	margin-top: 30px;
}
h3 {
	font: 60px Boogaloo;
	color: white;
	text-shadow: 4px 4px 0 black;
}

button {
	font: 52px Boogaloo;
	color: white;
	background: none;
	border: 0;
	background-image: url("../images/UI/btn1_up.png");
	width: 353px;
	height: 147px;
	padding-bottom: 40px;
	text-decoration: none;
	cursor: pointer;
	vertical-align:top;
}

button:hover  {
	background-image: url("../images/UI/btn1_over.png");
}

button:active  {
	background-image: url("../images/UI/btn1_down.png");
	padding-bottom: 20px;
}



button:focus 
{
	outline:0;
}

button.back {
	background-image: url("../images/Clubhouse/back_btn_up.png");
	width: 163px;
	height: 147px;
	position: absolute;
	bottom: 30px;
	left: 30px;
}

button.back:hover {
	background-image: url("../images/Clubhouse/back_btn_over.png");
}

button.back:active {
	background-image: url("../images/Clubhouse/back_btn_down.png");
}

button.menu {
	background-image: url("../images/Level Select Map/menu_btn_idle.png");
	position: absolute;
	z-index: 103;
	top: 20px;
	left: 20px;
	width: 119px;
	height: 134px;
	pointer-events: auto;
}

button.menu:hover {
	background-image: url("../images/Level Select Map/menu_btn_hover.png");
}

button.menu:active {
	background-image: url("../images/Level Select Map/menu_btn_click.png");
}

button:disabled {
	background-image: url("../images/UI/btn1_grey.png");	
}

.container {
	padding-right: 0px;
	padding-left: 0px;
}

#menusContainer {
	position: absolute;
	padding: 0;
	margin: 0;
	width: 1600px;
	height: 1200px;
	pointer-events: none;
}

.smorball-screen {
	padding: 0;
	margin: 0;
	text-align: center;
	position: absolute;
	top: 0;
	left: 0;
	width: 1600px;
	height: 1200px;
	pointer-events: none;	
}

.smorball-bordered-container {
	background-image: url("../images/UI/level_end_box.png");
	background-size: 100% 100%;
	padding: 60px;
}

.well {
	background: none;
	background-image: url("../images/UI/level_end_inner_box.png");
	background-size: 100% 100%;
	border: 0;
}

.slider.slider-horizontal {
	width:100%;
	height: 100px;
}

.click-cover {
	z-index: 104;
	position: absolute;
	top:0;
	left: 0;
	width: 1600px;
	height: 1200px;
	background-color: black;
	opacity: 0.5;
	pointer-events: auto;
}


button.close {
	background-image: url("../images/UI/close_btn.png");
	width: 85px;
	height: 89px;
	opacity: 1;
}

button.close:hover {
	background-image: url("../images/UI/close_btn.png");
	opacity: 1;
}

button.close:active {
	background-image: url("../images/UI/close_btn.png");
	opacity: 1;
}

button.close:focus {
	opacity: 1;
}

.slider.slider-horizontal .slider-tick, .slider.slider-horizontal .slider-handle {
	background: none;
	background-image: url("../images/UI/scroller_btn.png");
	width: 85px;
	height: 89px;
	cursor: pointer;
	float:left;
	border: 0;
	margin-top: -38px;
	margin-left: -40px;
}

.slider-track {
	height: 15px;
}

.slider-track-high {
	background-color: #d91111;
}

.cashbar {
	width: 427px;
	height: 137px;
	font-size: 80px;
	padding-right: 30px;
	text-align: right;
	background-image: url("../images/UI/cash_bar.png");
}

.cashbar-small {
	width: 341px;
	height: 135px;
	font-size: 80px;
	padding-right: 30px;
	text-align: right;
	background-image: url("../images/UI/cash_bar_small.png");
}

button.left-arrow {
	background-image: url("../images/UI/arrow_up.png");
	width: 96px;
	height: 130px;
}

button.left-arrow:hover {
	background-image: url("../images/UI/arrow_up.png");
}

button.left-arrow:active {
	background-image: url("../images/UI/arrow_down.png");
}

button.right-arrow {
	background-image: url("../images/UI/arrow_up.png");
	width: 96px;
	height: 130px;
	transform: scale(-1, 1);
    -webkit-transform: scale(-1,1);
    -ms-transform: scale(-1,1);
}

button.right-arrow:hover {
	background-image: url("../images/UI/arrow_up.png");
}

button.right-arrow:active {
	background-image: url("../images/UI/arrow_down.png");
}


button.forward {
	background-image: url("../images/Clubhouse/back_btn_up.png");
	width: 163px;
	height: 147px;
	transform: scale(-1,1);
    -webkit-transform: scale(-1,1);
    -ms-transform: scale(-1,1);
}

button.forward:hover {
	background-image: url("../images/Clubhouse/back_btn_over.png");
}

button.forward:active {
	background-image: url("../images/Clubhouse/back_btn_down.png");
}

.red-text {
	color: red;
}




.range-slider {
  width:420px;
  height:20px;
  margin-top: 40px;
  margin-bottom: 40px;
  position:relative;
  cursor: pointer;
  padding: 0;
}

.range-slider .before-bar {
	background-color: red;
	height: 10px;
	border-radius: 4px;
	position:relative;
	z-index:1;
}

.range-slider .after-bar {
	background-color: white;
	height: 10px;
	border-radius: 4px;
	position:relative;
	z-index:1;
}

.range-slider .handle {
	background: none;
	background-image: url("../images/UI/scroller_btn.png");
	width: 85px;
	height: 89px;
	cursor: pointer;
	border: 0;
	position:relative;
	z-index:2;
	top:0;
	left:0;
}