body {
	padding:0;
	margin:0;
	font-family: verdana;
	font-size: 8pt;
	color:#EFEFEF;
	background-color: #111111;
	background-image: url('/_images/2013/bg.png');
	line-height:150%;
}

#page-wrapper { width:1050px; margin:10px auto; position:relative; border: 0px solid #999; background-color:#000; margin-bottom:20px;
	border-radius: 10px;
	box-shadow: 0px 0px 20px #0B899F;
}

#status-bar { width:877px; float:right; height:40px; background-color:#19272a; box-shadow: 0px 0px 20px #06515E inset; border-top-right-radius: 10px; }
#status-bar-inner { position:relative; width:877px; height:40px; }

#left-column { width:173px; float:left; border: 1px solid #abc4cb; border-top:0; border-left:0; background-color:#19272a; border:0; box-shadow: 0px 0px 20px #06515E inset; border-top-left-radius: 10px; border-bottom-left-radius: 10px;}

#data-area { width:877px; float:right; margin-bottom:85px; margin-top:30px; }
#data-padding { padding:10px; position:relative; }

.clr { clear:both; }

.menu-item {  font-family:verdana; font-size:8pt; border-bottom:1px dotted #4D656C; padding:2px 0 2px 10px; }

.menu-divider { height:15px; }

#footer-stats { position:absolute; bottom:0; right:0; width:877px; height:83px; background-color:#19272a; box-shadow: 0px 0px 20px #06515E inset; border-bottom-right-radius: 10px; }
.footer-stats-item { width:438px; float:left; }

table.stats td { padding:2px; border-bottom:1px dotted #4D656C; }

#online-users { border-radius: 10px; box-shadow: 0px 0px 20px #0B899F inset; overflow:hidden; padding:10px; background-color:#162325;}
#random-wrapper { border-radius: 10px; box-shadow: 0px 0px 20px #DFDFDF inset; overflow:hidden; padding:10px; background-color:#162325;}

.faction-image { border-radius:10px; }

#faction-image-wrapper { padding:3px; border-radius:10px; overflow:hidden; padding-top:0; }

#main-episode { border-radius:10px; box-shadow: 0px 0px 20px #0B899F inset; padding:5px; margin-bottom:15px;}
#main-episode-text { float:left; width:620px; line-height:150%; }
#main-episode-image { float:right; width:200px; border-radius:10px; overflow:hidden; }

td { line-height:200%; }

/*.front-passengers { width:400px; float:left; border-radius:10px; box-shadow: 0px 0px 20px #09788C inset; padding:10px; margin-bottom:15px; text-align:center; background-color:#24393E; }*/
.front-passengers {  border-radius:10px; box-shadow: 0px 0px 20px #09788C inset; padding:10px; margin-bottom:15px; text-align:center; background-color:#24393E; }


.floater{
	position:fixed;
	top:0px;
	z-index:3000;
	border-top:none;
	display:block;
	margin:0 auto;
	margin-left:173px;

	padding-top:10px;
}

.floater-menu{
	position:fixed;
	top:0px;
	z-index:3000;
	border-top:none;
	display:block;
	margin:0 auto;

	padding-top:10px;
}

.floater-footer{
	position:fixed;
	bottom:0px;
	z-index:3000;
	display:block;
	margin:0 auto;

}

.status-time { float:left; margin:5px 0px 0 15px; font-size:8.5pt; text-align:left; }
.status-location { float:right; margin:4px 10px 0 0; font-size:8.5pt; text-align:right; width:150px; overflow:hidden; }
.status-icon { float:right; margin:10px 12px 0 0; font-size:8.5pt; border-1px solid #FFF; z-index:1000; }
.status-drop-subscriber { position:absolute; bottom:-24px; right:0; z-index:1000; box-shadow: 0px 0px 20px #06515E inset; border-bottom-left-radius: 5px; padding:2px; background-color:#19272a; }

#link-bar { position:absolute; bottom:-30px; height:30px; left:10px; width:740px;z-index:1000; text-align:center; box-shadow: 0px 0px 20px #06515E inset; background-color:#162325; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; margin:7px 5px 0 5px; display:none; }
.link-bar-item { float:right; padding:4px 5px; box-shadow: 0px 0px 20px #097588 inset; background-color:#2C4649; border-radius: 5px; margin:3px 5px 0 5px; }
.link-bar-item a { display:block; }

.wrapper { border-radius:10px; box-shadow: 0px 0px 20px #0B899F inset; padding:15px; margin-bottom:15px; font-size:10pt; font-family:'Open Sans', sans-serif;}
.heading { display:block; width:97%; padding:5px; box-shadow: 0px 0px 20px #06515E inset; background-color:#162325; border-radius: 5px; }

.wrapperSelect:hover { box-shadow: 0px 0px 20px #0C8FDE inset; }


#timer-bar { position:absolute; bottom:-30px; height:30px; left:10px; width:740px;z-index:1000; text-align:center; box-shadow: 0px 0px 20px #06515E inset; background-color:#162325; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; margin:7px 5px 0 5px; display:none; }
#timer { float:right; margin:12px 10px 0 0; font-size:8.5pt; }

span.counter { height:7px; padding:2px; border-radius:15px; background-color:#AF0303; font-size:7.5pt; color:#FFF; padding-right:3px; }

hr.grey { color:#06515E; background-color:#06515E; border-color:#06515E; }

#random-item { position:absolute; width:150px; height:150px; z-index:5000; background-color:#000; border-radius: 10px; overflow:hidden; display:none; }
#random-item:hover { cursor:pointer; }
#rcounter { position:absolute; bottom:2px; right:5px; padding:2px; }
#ritem { position:absolute; left:10px; top:50px; text-align:center; width:130px; display:none; font-size:13pt; font-weight:bold; color:#FFF; text-shadow: 2px 2px 5px #000000; }
.random-small { font-size:9pt; font-weight:normal; }

#copyright { margin:5px auto; font-family:verdana; font-size:7.5pt; color: #666666; text-align:center; clear:both; }

#gateWrapper { width:660px; height:660px; margin:10px auto; position:relative; }
#gateImage { position:absolute; top:0; left:0; z-index:2000; }
.gateGlyph { position:absolute; z-index:2001; }
.gateChevron { position:absolute; z-index:2002; }
#info-panel { position:absolute; z-index:2003; left:170px; top:170px; width:315px; height:315px; border-radius: 10px; box-shadow: 0px 0px 20px #0B899F;}

#mission-bar { position:absolute; left:120px; top:0; width:180px; height:35px; text-align:left; font-family:arial; font-size:12pt; font-weight:bold; }

#status-biometrics { position:absolute; left:300px; top:0; width:200px; height:35px; text-align:left; background-image:url('/_images/common/biometrics.png'); }
#status-biometrics img { position:absolute; left:2px; }
#status-biometrics:hover { cursor:pointer; }
.collection-thumb { float:left; width:260px; height:150px; border-radius:10px; box-shadow: 0px 0px 20px #0B899F; margin:25px 10px; overflow:hidden; }
.collection-thumb img { border-radius:10px; }

a.deploy { color:#FF6600; }
a.deploy:hover { color:#FF9B59; }

.displayTable td { line-height:100%; padding:3px; margin:0; }

.transitem { min-width:30px; min-height:30px; }

#locationDescription td { font-size:10pt; font-family:'Open Sans', sans-serif; }
#locationDescription td.heading { font-size:12pt; font-family:'Open Sans', sans-serif; font-weight:700; }
#locationHeading td { font-size:12pt; font-family:'Open Sans', sans-serif; font-weight:700; }

.button {
    background-color: #E60000; /* Green */
    border: none;
    color: white;
    padding: 5px 10px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 11.5px;
	border-radius: 4px;
}

.button:active {
    background-color: #D30601; /* Green */
    padding: 6px 9px 4px 11px;
	border:none;
}

.button:hover {
    color: #FFFF66;
	cursor:pointer;
}

.small { font-size:7.5pt; }

.bubble { display:inline-block; background-color:red;padding:0 2px 2px 2px; margin-left:5px; border-radius: 15px; font-size:7.5pt; font-family:verdana; height:14px; text-align:center; }


/*ACCORDION*/


/*Time to apply widths for accordian to work
Width of image = 640px
total images = 5
so width of hovered image = 640px
width of un-hovered image = 40px - you can set this to anything
so total container width = 640 + 40*4 = 800px;
default width = 800/5 = 160px;
*/

.accordian {
	width: 857px;
	height: 320px;
	overflow: hidden;
	
	/*Time for some styling*/
	margin: 0 auto;
	box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.35);
	-webkit-box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.35);
	-moz-box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.35);
}

/*A small hack to prevent flickering on some browsers*/
.accordian ul {
	width: 2000px;
	margin:0;
	/*This will give ample space to the last item to move
	instead of falling down/flickering during hovers.*/
}

.accordian li {
	position: relative;
	display: block;
	width: 196px;
	float: left;
	margin-left:-50px;
	
	border-left: 2px solid #000000;
	
	box-shadow: 0 0 25px 10px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: 0 0 25px 10px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 0 0 25px 10px rgba(0, 0, 0, 0.5);
	
	/*Transitions to give animation effect*/
	transition: all 1s;
	-webkit-transition: all 1s;
	-moz-transition: all 1s;
	/*If you hover on the images now you should be able to 
	see the basic accordian*/

}

/*Reduce with of un-hovered elements*/
.accordian ul:hover li {width: 113px;}
/*Lets apply hover effects now*/
/*The LI hover style should override the UL hover style*/
.accordian ul li:hover {width: 600px;}


.accordian li img {
	display: block;
}

.accordian .tab-links { position:absolute; border:1px solid #000; top:15px; left:185px; width:335px; height:270px; background-image:url('/_images/75.png'); font-size:9pt; }

.accordian .tab-links .link { clear:both; text-align:center; padding:0; margin:7px 20px; }

.padsmall { padding:5px; font-size:7.5pt; line-height:120%; }
.pad { padding:5px; font-size:8.5pt; }
.pad10 { padding:10px; font-size:8.5pt; }

