html {
	height: 100%;

}
body {
	background-color: #000;
	overflow: hidden;
	padding: 0px;
	margin: 5px;

	height: 98%;
	position: relative;
	font-family : "Verdana";
}

/* *** */
#boxLogo {
	position: absolute;
	z-index: 9010000;
	
	top: -5px;
	left: -4px;
	text-align: center;
	color: #fff;
	font-weight: bold;
	
	font-variant:small-caps;
	
}

#subfooter {
	display: none !important;
}

/* -------------------------- */

.boxCommentOverlayContainer {
	padding-top: 150px;
	overflow: hidden;
}

#simplemodal-overlay,
.simplemodal-container {
	z-index: 9000000 !important;
}


/* -------------------------- */


.canvasNav {
	display: none;
	position: absolute;
	
	
	//right: 0.33rem;
	left: 275px;
	
	width: calc(100% - 350px);
	max-width: 60rem;
	
	min-height: 3rem;
	
	border: 2px solid rgba(var(--main-fg-dark-color), 1) ;
	background-color: rgba(var(--main-fg-color), 0.6);
	border-radius: 0.5em;
	margin-top: 0.75rem;
	padding: 0.33rem;
	
	
	z-index: 9010000;
}

.canvasNav nav {
	display: flex;
	justify-content: space-around;
	align-items: center;
	flex-wrap: wrap;
	
	height: 100%;
}

.canvasNav nav > * {
	flex-basis: 33%;
	text-align: center;
	
	text-shadow:
		1px 1px 0 rgba(255,255,255,0.4),
		-1px -1px 0 rgba(255,255,255,0.4),  
		1px -1px 0 rgba(255,255,255,0.4),
		-1px 1px 0 rgba(255,255,255,0.4),
		1px 1px 0 rgba(255,255,255,0.4);
}

.minibContent  {
	text-shadow:
		1px 1px 0 rgba(0, 0, 0, 0.4),
		-1px -1px 0 rgba(0, 0, 0, 0.4),  
		1px -1px 0 rgba(0, 0, 0, 0.4),
		-1px 1px 0 rgba(0, 0, 0, 0.4),
		1px 1px 0 rgba(0, 0, 0, 0.4);
}




/* *** */
#canvas {
	position: relative;
	display: block;
	height: 100%;

	overflow: hidden;
	background: #000 url('images/space_bg.gif'); 
	/* background: #000 url('//img.ffffound.com/static-data/assets/6/646ad1f034e865c34c656b75a3758193ef11ccd2_m.gif'); */
	color: #FFF;
	
	border-radius: 10px;
	
	box-shadow: 0px 0px 20px rgba(0,0,0,0.8);
}

#canvas .starletContainer {
	position: absolute;
	//overflow: hidden;
	
	width: 300px;
	height: 300px;
	
	box-shadow: 0px 0px 50px rgba(0,0,0,0.8);
	
	//background-color: #ccc;
	//border: solid 1px rgba(0,255,0,0.5);
	
	
	border-radius: 2rem;
	overflow: hidden;

}

#canvas .starlet {
	//display: none;
	
	position: relative;
	
	height: 100%;
	width: 100%;
	

	
}

.starlet.proto {
	display: none;
}

/*

#canvas .tnBTN{
	padding-top:2px;
	padding-bottom:2px;
}

#canvas .button{
	position:	absolute;
	background-color: #2b2b2b;
	display: none;
	right: 0px;
	
	width:30;
	height:100;
	
	border-left: 3px solid #121211;
	border-bottom: 3px solid #121211;
	border-bottom-left-radius: 10px;
	
}
*/

.maxPassesIcon img {
	max-height: 32px;
}

#canvas .nearContent {
	position: absolute;
	
	top: 0;
	left: 0;
	
	width: 100%;
	height: 100%;
	
	z-index: 5;
	
	opacity: 0;
	
	display: none;
	//background-color: teal;
	flex-direction: column-reverse;
}

#canvas .nearContent .tinyID {
	position: absolute;
	
	overflow: hidden;
	text-align: left;
	top: 2px;
	
	padding-left: 0.5em;
	cursor: pointer;
	font-size: 0.6em;
	color: white;
	color: rgba(230,230,230,0.5);
	z-index: 5;
}

#canvas .bottomBar {
	position: absolute;
	bottom: 0;
	
	background-color: #2b2b2b;
	border-top: 3px solid #121211;
	
	width: 100%;
	overflow: hidden;
	
	//display: flex;
	display: none;
}

.starlet.captionText {
	display: flex;
}

#caption .imgNum{
	font-style:	italic;
	font-size:	0.5em;
}


#canvas .maxPassesContainer {
	display: inline-flex;
	z-index: 10;
	
	flex-basis: 10%;
}

/*--------------------------------*/
#bottombar {
	width: 95%;
	display: block;
	height:60px;
	position: absolute;
	bottom: 0px;
	margin: auto;
	overflow: auto;
	
	border: 3px solid #2b2b2b;
	text-align: center;
	
	color: #fff;

	z-index:999999;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	
	background-color: #121211;
	background: rgba(94, 107, 165, 0.6);

	opacity: 0.8;
}


/*--------------------------------*/

.rightBar {
	position: absolute;
	right: 0;
	height: 100%;
	
	list-style-type: none;
	text-align: right;
	
	//align-items: center;
	
	
	//background-color: teal;
	
	display: flex;
	flex-direction: column;
	
	
}

.rightBar li {
	margin: 0.25em 0.15em;
}

.minibViews,
.minibFavs,
.minibComments
{
	min-width: 40px;
	font-size: 0.85rem;
}

.minibComments img {
	position: relative;
	top: 0.2em;
}

.rightBar .group1 img {
	max-width: 22px;
}
	
.minibFavs {
	position: relative;
	display: flex;
	
}
.minibFavCount {
	flex-grow: 1;
}




/* - - - - - - - - - - - - - - - - - - */

.minibComments {
	
}
	
.minibCommentsDisabled {
	height: 14px !important;
}

/* - - - - - - - - - - - - - - - - - - */

#boxBills2Pay {
	display: none;
	
	position: absolute;
	
	width: 100%;
	min-height: 90px;
	
	right: 0.33em;
	bottom: 0.33em;
	z-index: 9000000;
	
	text-align: right;
	margin: auto;
}

#boxBills2PayContent {
	position: absolute;
	
	max-width: 728px;
	max-height: 90px;
	overflow: hidden;
	
	right: 0;
}


/* - - - - - - - - - - - - - - - - - - */

@media only screen and (max-width : 850px) {
	.canvasNav .navOtherSites img {
		max-width: 5em;
	}
	.canvasNav nav {
		//flex-direction: column;
	}
	
	.canvasNav nav > * {
		margin-bottom: 0.4em;
	}
	
	#boxBills2PayContent
	{
		position: relative;
		margin: auto;

		width: 100%;
		
		transform: scale(0.7);
	}
	
	#boxLogo img {
		max-width: 10em;

	}
}