/**
@copyright Uday Thombre (https://udaythombre.com)
@author Uday Thombre (uday@udaythombre.com)
@description Cadcade Style Sheets - Contents - Theater Shows - Dashboard
@intelligenceProperty Uday Thombre (uday@udaythombre.com)
 */


:root {

	--dashboard-pane-top : 5px;
	--dashboard-pane-left : 5px;
	--dashboard-pane-fore-color : #efefef;
	--dashboard-pane-back-color : #4b545f;
	--dashboard-pane-gradient-fore-color : #4f5964;
	--dashboard-pane-gradient-back-color : #5f6975;
	--dashboard-pane-border-shadow : 0px 0px 9px rgb(145, 145, 145);
	/*--dashboard-pane-width : 800px;*/
	--dashboard-pane-width : 99%;
	--dashboard-pane-max-width : 99%;
	--dashboard-pane-height : 99%;
	--dashboard-pane-max-height : 99%;
	--dashboard-pane-border-radius : 5px;
	--dashboard-pane-visibility : display;
	
	--dashboard-pane-name-top : 0px;
	--dashboard-pane-name-left : 0px;
	--dashboard-pane-name-fore-color : #efefef;
	--dashboard-pane-name-back-color : #4b545f;
	--dashboard-pane-name-gradient-fore-color : rgb(146, 146, 146);
	--dashboard-pane-name-gradient-back-color : rgb(192, 192, 192);
	--dashboard-pane-name-border-shadow : 0px 0px 9px rgb(145, 145, 145);
	--dashboard-pane-name-width : 100%;
	--dashboard-pane-name-max-width : 100%;
	--dashboard-pane-name-height : 50px;
	--dashboard-pane-name-max-height : 50px;
	--dashboard-pane-name-border-radius : 5px;
	--dashboard-pane-name-font-size : 18px;
	--dashboard-pane-name-font-variant : small-caps;
	--dashboard-pane-name-font-weight : bold;
	
	--dashboard-pane-name-operators-left : 100px;
	
	--dashboard-pane-viewer-top : 75px;
	--dashboard-pane-viewer-left : 5px;
	--dashboard-pane-viewer-fore-color : #efefef;
	--dashboard-pane-viewer-back-color : #4b545f;
	--dashboard-pane-viewer-gradient-fore-color : rgb(146, 146, 146);
	--dashboard-pane-viewer-gradient-back-color : rgb(192, 192, 192);
	--dashboard-pane-viewer-border-shadow : 0px 0px 9px rgb(145, 145, 145);
	--dashboard-pane-viewer-width : 99%;
	--dashboard-pane-viewer-max-width : 99%;
	--dashboard-pane-viewer-height : 73%;
	--dashboard-pane-viewer-max-height : 99%;
	--dashboard-pane-viewer-border-radius : 5px;
	--dashboard-pane-viewer-font-size : 12px;
	--dashboard-pane-viewer-font-variant : small-caps;
	--dashboard-pane-viewer-font-weight : bold;
	
	--dashboard-pane-viewer-object-top : 65px;
	--dashboard-pane-viewer-object-left: 4px;
	--dashboard-pane-viewer-object-width : 99%;
	--dashboard-pane-viewer-object-max-width : 99%;
	--dashboard-pane-viewer-object-height : 336px;
	--dashboard-pane-viewer-object-max-height :800px;
	--dashboard-pane-viewer-object-border-style : inset;
	--dashboard-pane-viewer-web-frame-back-color: white;
	
	--dashboard-pane-viewer-web-frame-top : 0px;
	--dashboard-pane-viewer-web-frame-left: 0px;
	--dashboard-pane-viewer-web-frame-width : 100%;
	--dashboard-pane-viewer-web-frame-max-width : 100%;
	--dashboard-pane-viewer-web-frame-height : 390px;
	--dashboard-pane-viewer-web-frame-max-height : 800px;
	--dashboard-pane-viewer-web-frame-border-style : inset;
	--dashboard-pane-viewer-web-frame-back-color: white;
}

televisionshows theater filmetography dashboard {
	visibility: var(--dashboard-pane-visibility);
	top : var(--dashboard-pane-top);
	left : var(--dashboard-pane-left);
	position : absolute;
	background : var(--dashboard-pane-back-color);
	background: linear-gradient(top, var(--dashboard-pane-gradient-fore-color) 0%, var(--dashboard-pane-gradient-back-color) 100%);
    background: -moz-linear-gradient(top, var(--dashboard-pane-gradient-fore-color) 0%, var(--dashboard-pane-gradient-back-color) 100%);
    background: -webkit-linear-gradient(top, var(--dashboard-pane-gradient-fore-color) 0%, var(--dashboard-pane-gradient-back-color) 100%);
    box-shadow: var(--dashboard-pane-border-shadow);
	display: inline-table;
    font-size: 11px;
	width : var(--dashboard-pane-width);
	max-width : var(--dashboard-pane-max-width);
	height : var(--dashboard-pane-height);
	max-height : var(--dashboard-pane-max-height);
	color : var(--dashboard-pane-fore-color);
	padding: 5px;
	border-style : inset;
	border-radius : var(--dashboard-pane-border-radius);
}
televisionshows theater filmetography dashboard name {
	top : var(--dashboard-pane-name-top);
	left : var(--dashboard-pane-name-left);
	position : absolute;
	background : var(--dashboard-pane-name-back-color);
	background: linear-gradient(top, var(--dashboard-pane-name-gradient-fore-color) 0%, var(--dashboard-pane-name-gradient-back-color) 100%);
    background: -moz-linear-gradient(top, var(--dashboard-pane-name-gradient-fore-color) 0%, var(--dashboard-pane-name-gradient-back-color) 100%);
    background: -webkit-linear-gradient(top, var(--dashboard-pane-name-gradient-fore-color) 0%, var(--dashboard-pane-name-gradient-back-color) 100%);
    box-shadow: var(--dashboard-pane-name-border-shadow);
	display: inline-table;
    font-size: 11px;
	width : var(--dashboard-pane-name-width);
	max-width : var(--dashboard-pane-name-max-width);
	height : var(--dashboard-pane-name-height);
	max-height : var(--dashboard-pane-name-max-height);
	color : var(--dashboard-pane-name-fore-color);
	padding: 10px;
	border-style : inset;
	border-radius : var(--dashboard-pane-name-border-radius);
	font-size : var(--dashboard-pane-name-font-size);
	font-variant: var(--dashboard-pane-name-font-variant);
	font-weight: var(--dashboard-pane-name-font-weight);
}
televisionshows theater filmetography dashboard name operators {
	box-shadow: var(--dashboard-pane-name-border-shadow);
	display : flex;
	justify-content: flex-end;	
	font-variant : var(--dashboard-pane-viewer-font-variant);
}
televisionshows theater filmetography dashboard name operators subject {
	color : var(--dashboard-pane-name-fore-color);
	display : flex;
	justify-content: flex-start;
	font-variant: var(--dashboard-pane-name-font-variant);
	font-weight: var(--dashboard-pane-name-font-weight);
	font-size : 13px;
	padding: 5px;	
}
televisionshows theater filmetography dashboard name operators button {
	font-variant: var(--dashboard-pane-name-font-variant);
}
televisionshows theater filmetography dashboard viewer {
	top: var(--dashboard-pane-viewer-top);
	left: var(--dashboard-pane-viewer-left);
	background: var(--dashboard-pane-viewer-back-color);
	color : var(--dashboard-pane-viewer-fore-color);
	width : var(--dashboard-pane-viewer-width);
	max-width : var(--dashboard-pane-viewer-max-width);
	height : var(--dashboard-pane-viewer-max-height);
	max-height : var(--dashboard-pane-viewer-max-height);
	font-size : var(--dashboard-pane-viewer-font-size);
	font-variant : var(--dashboard-pane-viewer-font-variant);
	font-weight : var(--dashboard-pane-viewer-font-weight);
	padding: 5px,5px;
}
televisionshows theater filmetography dashboard viewer object {
	top : var(--dashboard-pane-viewer-object-top);
	left: var(--dashboard-pane-viewer-object-left);
	width : var(--dashboard-pane-viewer-object-width);
	max-width : var(--dashboard-pane-viewer-object-max-width);
	height : var(--dashboard-pane-viewer-object-height);
	max-height : var(--dashboard-pane-viewer-object-max-height);
	border-style : var(--dashboard-pane-viewer-object-border-style);
	background : var(--dashboard-pane-viewer-web-frame-back-color);
	/*padding: 1px,1px;*/
}
televisionshows theater filmetography dashboard viewer .webFrame {
	top : var(--dashboard-pane-viewer-web-frame-top);
	left: var(--dashboard-pane-viewer-web-frame-left);
	width : var(--dashboard-pane-viewer-web-frame-width);
	max-width : var(--dashboard-pane-viewer-web-frame-max-width);
	height : var(--dashboard-pane-viewer-web-frame-height);
	max-height : var(--dashboard-pane-viewer-web-frame-max-height);
	border-style : var(--dashboard-pane-viewer-web-frame-border-style);
	background: var(--dashboard-pane-viewer-web-frame-back-color);
}

.dashboard_widget {
	visibility: var(--dashboard-pane-visibility);
	top : var(--dashboard-pane-top);
	left : var(--dashboard-pane-left);
	position : absolute;
	background : var(--dashboard-pane-back-color);
	background: linear-gradient(top, var(--dashboard-pane-gradient-fore-color) 0%, var(--dashboard-pane-gradient-back-color) 100%);
    background: -moz-linear-gradient(top, var(--dashboard-pane-gradient-fore-color) 0%, var(--dashboard-pane-gradient-back-color) 100%);
    background: -webkit-linear-gradient(top, var(--dashboard-pane-gradient-fore-color) 0%, var(--dashboard-pane-gradient-back-color) 100%);
    box-shadow: var(--dashboard-pane-border-shadow);
	display: inline-table;
    font-size: 11px;
	width : var(--dashboard-pane-width);
	max-width : var(--dashboard-pane-max-width);
	height : var(--dashboard-pane-height);
	max-height : var(--dashboard-pane-max-height);
	color : var(--dashboard-pane-fore-color);
	padding: 5px;
	border-style : inset;
	border-radius : var(--dashboard-pane-border-radius);
}
.dashboard_widget name {
	top : var(--dashboard-pane-name-top);
	left : var(--dashboard-pane-name-left);
	position : absolute;
	background : var(--dashboard-pane-name-back-color);
	background: linear-gradient(top, var(--dashboard-pane-name-gradient-fore-color) 0%, var(--dashboard-pane-name-gradient-back-color) 100%);
    background: -moz-linear-gradient(top, var(--dashboard-pane-name-gradient-fore-color) 0%, var(--dashboard-pane-name-gradient-back-color) 100%);
    background: -webkit-linear-gradient(top, var(--dashboard-pane-name-gradient-fore-color) 0%, var(--dashboard-pane-name-gradient-back-color) 100%);
    box-shadow: var(--dashboard-pane-name-border-shadow);
	display: inline-table;
    font-size: 11px;
	width : var(--dashboard-pane-name-width);
	max-width : var(--dashboard-pane-name-max-width);
	height : var(--dashboard-pane-name-height);
	max-height : var(--dashboard-pane-name-max-height);
	color : var(--dashboard-pane-name-fore-color);
	padding: 10px;
	border-style : inset;
	border-radius : var(--dashboard-pane-name-border-radius);
	font-size : var(--dashboard-pane-name-font-size);
	font-variant: var(--dashboard-pane-name-font-variant);
	font-weight: var(--dashboard-pane-name-font-weight);
}
.dashboard_widget name operators {
	box-shadow: var(--dashboard-pane-name-border-shadow);
	display : flex;
	justify-content: flex-end;	
	font-variant : var(--dashboard-pane-viewer-font-variant);
}
.dashboard_widget name operators subject {
	color : var(--dashboard-pane-name-fore-color);
	display : flex;
	justify-content: flex-start;
	font-variant: var(--dashboard-pane-name-font-variant);
	font-weight: var(--dashboard-pane-name-font-weight);
	font-size : 13px;
	padding: 5px;	
} 
.dashboard_widget name operators button {
	font-variant: var(--dashboard-pane-name-font-variant);
}
.dashboard_widget viewer {
	top: var(--dashboard-pane-viewer-top);
	left: var(--dashboard-pane-viewer-left);
	background: var(--dashboard-pane-viewer-back-color);
	color : var(--dashboard-pane-viewer-fore-color);
	width : var(--dashboard-pane-viewer-width);
	max-width : var(--dashboard-pane-viewer-max-width);
	height : var(--dashboard-pane-viewer-max-height);
	max-height : var(--dashboard-pane-viewer-max-height);
	font-size : var(--dashboard-pane-viewer-font-size);
	font-variant : var(--dashboard-pane-viewer-font-variant);
	font-weight : var(--dashboard-pane-viewer-font-weight);
	padding: 5px,5px;
}
.dashboard_widget viewer object {
	top : var(--dashboard-pane-viewer-object-top);
	left: var(--dashboard-pane-viewer-object-left);
	width : var(--dashboard-pane-viewer-object-width);
	max-width : var(--dashboard-pane-viewer-object-max-width);
	height : var(--dashboard-pane-viewer-object-height);
	max-height : var(--dashboard-pane-viewer-object-max-height);
	border-style : var(--dashboard-pane-viewer-object-border-style);
	background : var(--dashboard-pane-viewer-web-frame-back-color);
	/*padding: 1px,1px;*/
}
.dashboard_widget viewer webframe {
	top : var(--dashboard-pane-viewer-web-frame-top);
	left: var(--dashboard-pane-viewer-web-frame-left);
	width : var(--dashboard-pane-viewer-web-frame-width);
	max-width : var(--dashboard-pane-viewer-web-frame-max-width);
	height : var(--dashboard-pane-viewer-web-frame-height);
	max-height : var(--dashboard-pane-viewer-web-frame-max-height);
	border-style : var(--dashboard-pane-viewer-web-frame-border-style);
	background: var(--dashboard-pane-viewer-web-frame-back-color);
}