@charset "utf-8";
/* CSS Document */

html {
	-webkit-font-smoothing: antialiased;
}

body {
	margin: 0px;
	color: #FFF;
	font-family: Roboto, sans-serif;
	font-size:14px;
	background-color: #000;
}

h1 {
    margin-top: 15px;
    margin-bottom: 15px;
}

h2 {
    color: #f69241;
}

.bg-home {
    background-image: url(../images/bg-main.jpg);
    background-position: top center;
    background-repeat: no-repeat;
}

.bg-normal {
    background-image: url(../images/bg-main2.jpg);
    background-position: top center;
    background-repeat: no-repeat;
}

a {
	text-decoration: none;
	color: #ffffff;
}

a:hover {
    text-decoration: none;
    color: #cccccc;
}

/*
.content-wrapper {
	position:relative;
	z-index: 49;
	width: 842px;
	margin-left: auto;
	margin-right: auto;
	box-sizing: border-box;
	padding: 0px 20px 0px 10px;
}
*/

.content-wrapper {
    width: 842px;
    box-sizing: border-box;
    margin-left: auto;
    margin-right: auto;
    padding: 10px 20px 30px 20px;
    border: 5px solid #2c5f7a;
    border-radius: 10px;
    background-color: rgba(2,18,28,0.7);
    margin-bottom: 30px;
}

.popup-wrapper {
    width: 842px;
    height:400px;
    box-sizing: border-box;
    margin-left: auto;
    margin-right: auto;
    padding: 10px 20px 30px 20px;
    border: 5px solid #2c5f7a;
    border-radius: 10px;
    background-color: rgba(2,18,28,0.7);
    margin-bottom: 30px;
}

.col2 {
    width: 395px;
    float: left;
}

.content-title {
    width: 842px;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
    position: relative;
}

.global-account {
    position: absolute;
    right: 0px;
    top: 5px;
}

.header-arrow {
    background-image: url(../images/sprites-main.png);
    background-position: -9px -81px;
    height: 27px;
    width: 27px;
    display: inline-block;
    position: relative;
    top: 5px;
    margin-right: 10px;
}

.fancy-hr {
    margin-top: -15px;
    background-image:url(../images/sprites-main.png);
    background-position: 0px -484px;
    background-repeat: no-repeat;
    text-align: center;
    opacity: 0.25;
    height: 10px;
    display: block;
}

.f-left {
	float: left;
	display:block;
}

.f-right {
	float: right;
	display: block;
}

.clear {
	clear: both;
}

.min-400 {
    min-height: 300px;
}

.scroll-right
{
    overflow-y:scroll;
    scrollbar-track-color: rgba(2,18,28,0.7);
    scrollbar-arrow-color: rgba(2,18,28,0.7);
    scrollbar-face-color: #555;
    scrollbar-shadow-color: #555;
}
.padding-all-20 {
    padding: 10px;
    box-sizing: border-box;
}

.bana-cash-all {
    font-weight: 700;
    font-size: 23px;
    color: #ffeb8c;
}

.txt-right {
    text-align: right;
}

.txt-left {
    text-align: left;
}

.txt-center {
    text-align: center;
}

.txt-header-desc {
    margin-top: -4px;
}

.txt-strong {
    font-weight: 700;
}

.table-full {
    width: 100%;
}

.table-padding td {
    padding: 3px;
}

.form-default {
    /*color: #bcd8ea;*/
}

.form-default input[type=text], .form-default input[type=password] {
    background-color : rgba(255,255,255,0.2);
    border: 1px solid black;
    padding: 3px;
    font-size: 15px;
    font-weight: 700;
}

.form-default label {
    font-size: 15px;
    color: #bcd8ea;
}

/* Mus tbe the same dimensions with #navigation */
#navigation-wrapper {
	width: 842px;
	height: 54px;
	margin-left: auto;
	margin-right: auto;
}

#navigation {
	width: 842px;
	height: 54px;
	margin-left: auto;
	margin-right: auto;
	background-image: url(../images/sprites-main.png);
	position:absolute;
	z-index: 50;
}

#header {
	padding-top: 37px;
}

#header-logo {
	position: absolute;
}

#navigation #menu {
	height:54px;
	margin: 0px 0px 0px 160px;
	padding: 0px;
}

#navigation #menu ul {
	display: block;
    margin: 0px;
    padding: 0px;
}

#header #navigation #menu li {
	display: block;
	float: left;
    margin : 0px;
    padding: 0px;
}

#header #navigation #menu a {
	box-sizing:border-box;
	height: 54px;
	display:block;
	padding: 16px 10px 0px 10px;
	color: #FFF;
	font-weight:500;
}

#header #navigation #menu a:hover {
	background-color: rgba(252,131,58,0.8);
}

#header-social {
	position: absolute;
	margin-left: 730px;
	width: 100px;
	height: 54px;
	box-sizing: border-box;
}

#header-fb, #header-yt {
	position: absolute;
	/*z-index: 10;*/
}

#header-fb {
	background-image:url(../images/sprites-main.png);
	background-position: 0px -57px;
	margin-top: 15px;
}

#header-yt {
	background-image:url(../images/sprites-main.png);
	background-position: -25px -57px;
	margin-left: 40px;
	margin-top: 18px;
}

#disco-video {
	margin-left: auto;
	margin-right: auto;
	background-color: rgba(0,0,0,0.5);
	width: 720px;
	height: 330px;
	/*margin-top: 20px;*/
	/*position:absolute;*/
}

#disco-video-wrapper {
	top: 110px;
	position: absolute;
	width: 100%;
}

#video1 {
	position: absolute;
	z-index:8;
}

#feature-wrapper {
	z-index: 49; /* Always below the navigation zindex */
	position:relative;
	width: 842px;
	margin-left: auto;
	margin-right: auto;
    /*height: 600px;*/
}

#feature-login {
	width: 277px;
	height: 168px;
	position: absolute;
	top: 40px;
	right: 0px;
    z-index: 10;
}

#feature-login-form {
    padding: 0px;
    margin: 0px 0px 5px 0px;
}

#feature-login input {
	/*color : #000;*/
}

#feature-login #user-info {
	width: 207px;
}

#feature-login #MainContent_homeLogin {
	display: block;
	height: 70px;
	width :65px;
	float:right;
	box-sizing:border-box;
	border-radius:8px;
	border: 1px solid rgba(255,255,255, 0.2);
	/*background-color: #378e9e;*/
	background: linear-gradient(to bottom, #56dcf4 0%,#2989d8 50%,#207cca 51%,#255e68 100%);
}

#feature-login #MainContent_homeLogin:hover {
	background: linear-gradient(to bottom, #56dcf4 0%,#2989d8 50%,#207cca 51%,#71338e 100%); 
}

#feature-login input[type=text], 
#feature-login input[type=password] {
	background-color: rgba(0,0,0,0.5);
	width: 207px;
	border: solid 2px #333;
	margin-bottom: 4px;
	box-sizing:border-box;
	padding: 5px 10px 5px 10px;
}

#feature-login #user-login {
    border: 3px solid #f6752e;
    width: 275px;
    height: 98px;
    background-color: rgba(0,0,0,0.5);
    border-radius: 10px;
    box-sizing: border-box;
    padding-top: 0px;
    margin-bottom: 10px;
}

#feature-login #user-login #user-header {
    background-color: #f6752e;
    text-align: center;
    padding: 5px;
}

#feature-login #user-login #user-btns {
    position: absolute;
    right: 12px;
    top: 45px;

}

#feature-login #user-login .bana-cash {
    font-size :24px;
    width: 140px;
    box-sizing: border-box;
    text-align: center;
    padding-top: 5px;
}

#feature-login #user-login .bana-cash-label {
    font-size: 12px;
    width: 140px;
    text-align: center;
}

#feature-banner {
	/*background-color: rgba(153,204,0,0.5);*/
	width: 842px;
	height: 300px;
	/*position: absolute;*/
	top: 180px;
}

#feature-banner #feature-text {
	/*background-color: #000;*/
	position:absolute;
	right: 0px;
	width: 550px;
    height: 155px;
	box-sizing:border-box;
	top: 245px;
	padding-right: 30px;
    /*overflow: hidden;*/
}

#feature-banner .feature-text-banner {
    position: absolute;
    top: 50px;
    right: 0px;
    width: 550px;
    opacity: 0;
}

#feature-banner #feature-text h1 {
	font-size: 40px;
	margin-bottom: 0px;
}

#feature-banner #feature-download {
	right: 0px;
	position:absolute;
	/*width: 200px;
	height: 100px;*/
	top: 410px;
}

#feature-banner #feature-character {
	position: absolute;
	/*background-color: lavender;*/
	/*height: 600px;*/
	top: 85px;
	/*left: -300px;*/
}

#feature-banner .slider-nav {
    position: absolute;
    width: 100%;
    top: 280px;
}

#feature-banner .slider-nav a {
    display: block;
    position: absolute;
    width: 50px;
    height: 49px;
    /*background-color: black;*/
    background-image: url(../images/arrows.png);
    opacity: 0.3;
}

#feature-banner .slider-nav .prev {
    left: 0px;
    background-position: -5px -35px;
}

#feature-banner .slider-nav .prev:hover {
    background-position: -125px -35px;
    opacity: 1;
}

#feature-banner .slider-nav .next {
    right: 0px;
    background-position: -65px -35px;
}

#feature-banner .slider-nav .next:hover {
    background-position: -185px -35px;
    opacity: 1;
}


#feature-sections {
	width: 842px;
	position: absolute;
	top: 490px;
}

#feature-sections .feature-col {
	display: inline-block;
	width:278px;
	height: 278px;
	background-image:url(../images/sprites-main.png);
	background-position: -70px -193px;
	float:left;
}

#feature-sections .ft-section-header {
	text-align: center;
}

#feature-sections .ft-section-header h3 {
	margin-top: 15px;
}

#feature-sections ul {
	margin : 0px;
	padding: 0px;
}

#feature-sections ul li {
	list-style-type:none;
	padding: 10px 10px 10px 10px;
	margin: 0px 3px 0px 3px;
	background-color: #465259;
}

#feature-sections .content-area {
	background-color: rgba(4,20,30,0.3);
	margin-left: 4px; 
	margin-right: 4px;
	oveflow: hidden;
	height: 223px;
}

#feature-sections a {
    color : #ffffff;
}

#feature-sections a:hover {
    color : #cccccc;
}

#feature-sections .event {
	height: 75px;
	display:block;
	/*background-image:url(../images/bg-main.jpg);*/
	border-radius: 0px 0px 10px 10px;
	background-position: center center;
    color : #ffffff;
    overflow: hidden;
    opacity: 0.5;
}

#feature-sections .event .event-hl {
    /*background-color: rgba(14,95,14,0.8);*/
    box-sizing: border-box;
    padding: 8px 10px 5px 10px;
    height: 37px;
    position: relative;
    bottom: -19px;
    text-align: center;
}

#feature-sections .event .event-dt {
    background-color: rgba(0,0,0,0.5);
    position: relative;
    width: 80px;
    font-size: 11px;
    bottom: -19px;
    padding: 2px 0px 2px 10px;
    left: -90px;
}

#feature-sections .alt {
	background-color: #192126;
}

#footer {
    width: 850px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    padding-top: 10px;
    font-size: 11px;
    font-weight: 500;
}

#footer .divider {
    display: inline-block;
    padding-left: 10px;
    padding-right: 10px;
}

#footer .copyright {
    opacity: 0.3;
    font-weight: 400;
    padding-top: 5px;
}

#footer-border {
    background-image:url(../images/sprites-main.png);
    background-position: 0px -484px;
    background-repeat: no-repeat;
    text-align: center;
    opacity: 0.25;
}

/* Use class for homepage footer, don't use for normal pages */
.footer-homepage {
    position: relative;
    z-index: 90;
    margin-top: 500px;
}

.equalizer {
    position: absolute;
    width:20px;
    height: 16px;
    top: 15px;
}

/* Buttons */
.btn-default {
	width: 275px;
	height: 27px;
	box-sizing: border-box;
	display: inline-block;
	color: #FFF;
	padding: 4px 15px 0px 15px;
	font-size: 12px;
	font-weight: 500;
}

.btn-feature-login {
    margin-bottom: 4px;
}

.btn-darkblue {
	background-image: url(../images/sprites-main.png);
	background-position: -71px -119px;
}

.btn-darkblue:hover {
	background-image: url(../images/sprites-main.png);
	background-position: -348px -119px;
	/*color: black;*/
}

.btn-orange {
	background-image: url(../images/sprites-main.png);
	background-position: -71px -88px;
}

.btn-orange:hover {
	background-image: url(../images/sprites-main.png);
	background-position: -348px -88px;
}

.btn-blue {
	background-image: url(../images/sprites-main.png);
	background-position: -71px -58px;
}

.btn-blue:hover {
	background-image: url(../images/sprites-main.png);
	background-position: -348px -58px;
}

.arrow-right {
	width: 8px;
	height: 8px;
	background-image:url(../images/sprites-main.png);
	background-position: 0px -86px;
	display: inline-block;
}

.btn-pink-large {
	background-image:url(../images/sprites-main.png);
	display: inline-block;
	background-position: -71px -149px;
	width:277px;
	height: 40px;
	text-align:center;
	color: #fff;
	box-sizing:border-box;
	padding-top: 10px;
	font-size: 16px;
	font-weight: 700;
}

.btn-pink-large:hover {
	background-position: -348px -149px;
}

.btn-trans {
    border : 1px solid #197ca9;
    display: inline-block;
    padding : 7px 7px 7px 7px;
}

.btn-trans:hover {
    background-color: rgba(0,0,0,0.5);
}

.btn-small {
    width: 159px;
    height: 27px;
    display: inline-block;
    box-sizing: border-box;
    font-weight: 700;
    text-align: center;
    margin: 0px;
    padding: 3px 0px 0px 0px;
    border: none;
    background-color: transparent;
}

.btn-small-blue {
    background-image: url(../images/sprites-main.png);
    background-position: -357px -200px;
}

.btn-small-blue:hover {
    background-position: -357px -229px;
    color: #051e2f;
}

.bg-green-trans {
    background-color: rgba(14,95,14,0.8);
}

.bg-violet-trans {
    background-color: rgba(52,14,95,0.8);
}

.bg-yellow-trans {
    background-color: rgba(88,95,14,0.8);
}

.bg-pink-trans {
    background-color: rgba(225,21,255,0.6);
}

.text-green {
    color : #32c62b;
}

/* Redbana Effects */
/* Comment everything that follows to disable effects */

.anim-char {
    position: absolute;
    top:0px;
    left: -100px;
    opacity: 0;
}

.background-effects {
	width:100%;
	position: absolute;
	height: 200px;
	z-index: 1;
	top: 0px;
	
}

.background-effects #disco-light {
	width: 100%;
	height: 500px;
	/*background-color: white;*/
	top: 0px;
	margin-left: auto;
	margin-right: auto;
	background-image:url(../images/fx.png);
	background-repeat: no-repeat;
	background-position: center top;
	
	/* Force hardware acceleration */
	transform:translate(0px,0px);
	position:absolute;
	z-index: 10;
	
}

.background-effects #speaker-light {
	/*background-color: #FFF;*/	
	height: 256px;
	width: 100%;
	position: absolute;
	z-index: 9;
	/*opacity: 0.5;*/
	margin-top: 112px;
}

.background-effects #speaker-light #speaker-light-s1 {
	/*background-image:url(../images/floor-light.jpg);*/
	height: 256px;
	width: 100%;
	position: absolute;
	background-position: top center;
	/*display:none;*/
}


.background-effects #speaker-light #speaker-light-s2 {
	background-image:url(../images/floor-light.jpg);
	height: 256px;
	width: 100%;
	position: absolute;
	/*background-position: -6px top;*/
	background-position: center top;
	/*display: none;*/
}


.background-effects #floor-light {
	width: 100%;
	height: 500px;
	top: 0px;
	background-image:url(../images/floor-light.jpg);
	background-repeat: no-repeat;
	background-position: center -600px;
	
	
	/* Force hardware acceleration */
	transform:translate(0px,0px);
	margin-top: 498px;
	position: absolute;
	
}


/* New Style */
.btn-space{
	margin-right: 5px;
}
.btn-small-orange {
    background-image: url(../images/sprites-main.png);
    background-position: -357px -259px;
}

.btn-small-orange:hover {
    background-position: -357px -291px;
    color: #051e2f;
}
.btn-small-gray {
    background-image: url(../images/sprites-main.png);
    background-position: -357px -324px;
}

.btn-small-gray:hover {
    background-position: -357px -356px;
    color: #051e2f;
}
.header-icon {
    background-image: url(../images/account-icon.png);
    background-position: -20px -65px;
    height: 15px;
    width: 20px;
    display: inline-block;
    position: relative;
    top: 1px;
    margin-right: 10px;
}
.birth-label{
	display: block;
}
.table-full-birth{
	    margin: 0px auto;
}
.table-full-birth label{
	text-align: center;
	color: #fff;
	padding-bottom: 5px;
}
.table-full-birth select{
	color: #fff;
}
.small-label{
	font-size: 11px;
}
.avail{
	text-decoration: underline;
	font-size: 11px;
	padding: 10px;
}
.form-default input[type=email], .form-default select{
	background-color: rgba(255,255,255,0.2);
    border: 1px solid black;
    padding: 3px;
    font-size: 15px;

}
.terms{
	font-size: 11px !important;
}
.newsletter{
	/*margin-top: 6px;*/
	float: left;
    margin-right: 5px;
}
.newsletter-2{
	/*margin-top: 6px;*/
    margin-right: 5px;
}
.gender{
	padding: 10px;
}
.security-quest{
	text-align: center;
    padding: 20px  !important;
}
.email-lost{
	width: 97%;
}
.sec-quest{
	    width: 86%;
	    color: Black !important;
}
.sec-ans{
	width: 84%;
}
.security-quest label {
        font-size: 11px;
}
.thank-message{
	text-align: center;
}
.input-text{
    color:Black;
}
.style_red {color: #FF0000}

#scroll-1::-webkit-scrollbar-track
{

	background-color: rgba(2,18,28,0.7);
}

#scroll-1::-webkit-scrollbar
{
	background-color: rgba(2,18,28,0.7);
}

#scroll-1::-webkit-scrollbar-thumb
{

	background-color: #555;
}

#scroll-1::-webkit-scrollbar-button
{
	background-color: rgba(2,18,28,0.7);
}