zombiebox/zb/css/zb.css

ZombieBox is a JavaScript framework for development of Smart TV and STB applications

/* Author: Htmlhero (http://htmlhero.ru) */

/* Globals
*******************************/

html, body {
	height: 100%;
}
body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 1.25;
}

/* Helpers
*******************************/

.zb-clear {}
	.zb-clear:before,
	.zb-clear:after {
		content: '';
	    display: table;
	}
	.zb-clear:after {
		clear: both;
	}

.zb-valign {
	display: inline-block;
	vertical-align: middle;
}
.zb-valign-helper {
	width: 0;
	height: 100%;
	display: inline-block;
	vertical-align: middle;
}

.zb-center {
	width: 100%;
	height: 100%;
	display: table;
	position: absolute;
	top: 0;
	left: 0;
}
	.zb-center__cell {
		text-align: center;
		vertical-align: middle;
		display: table-cell;
	}
	.zb-center__container {
		text-align: left;
		vertical-align: top;
		display: inline-block;
	}

.zb-fullscreen {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}

/* Structure
*******************************/

.zb-body {
	position: relative;
	user-select: none;
}

.zb-layer-container {
	background: #000;
	color: #fff;
	z-index: 1;
}

.zb-layer-container._transparent {
	background: transparent;
}

.zb-system-container {
	color: #fff;
	z-index: 2;
}

.zb-plugin-container {
	width: 0;
	height: 0;
	visibility: hidden;
	overflow: hidden;
	position: absolute;
	top: 100%;
	left: 100%;
}

/* Resolution
*******************************/

.zb-qhd {
	width: 960px;
	height: 540px;
}
.zb-hd {
	width: 1280px;
	height: 720px;
}
.zb-full-hd {
	width: 1920px;
	height: 1080px;
}

/* Layer */

.zb-layer {
	z-index: 1;
	overflow: hidden;
}
	.zb-layer__container {
		z-index: 1;
	}
	.zb-layer__children {
		z-index: 2;
	}
    .zb-layer__pointer-block {
	    z-index: 3;
    }

/* Widget */

.zb-widget {}