/* ------------------------------------------------------------- Standard Dashboard Style ------------------------------------------------------------- */

.xc-dashboard-root													/* The top-level dashboard container */
{
	padding-top: 0px;

	transition: margin linear .5s, padding linear .5s;
	padding-left: 0px;
	padding-right: 0px;
}

.widget-panel												/* A panel which houses widgets */
{
	/*
	min-height: 100px;
	min-width: 100px;
	*/

	margin: 0px;
	
	/*border: 1px solid transparent;*/
	transition: box-shadow linear .5s, border-color linear .5s, background-color linear .2s, margin linear .5s, padding linear .5s;
	box-sizing: border-box;
}


.panel-pad-top {
	padding-top: 20px;
}

.panel-pad-left {
	padding-left: 30px;
}

.panel-pad-left-extra {
    padding-left: 5%;
}

.panel-pad-right {
    padding-right: 30px;
}

.panel-pad-right-extra {
    padding-right: 5%;
}

.xc-dash-panel-title
{
	font-size: 16px;
	height:0px;
	overflow: hidden;
	text-align: center;
	transition: height linear .5s;
	color: #BBB;
}

.xc-widgetized-content
{
	/*border: 1px solid #bbb;*/
	background: #FAFAFA;
	/*box-shadow: 3px 3px 8px -4px rgba(0,0,0,.2);*/

	border-left: 1px solid #efefef;
	border-right: 1px solid #efefef;
	border-bottom: 1px solid #e2e2e2;
	box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.04);
}

.xc-dash-title-error
{
	color: #FF9090;
}


.widget-editing-covering
{
	opacity: 0;
}


/* ------------------------------------------------------------- Edit-Mode Dashboard Style ------------------------------------------------------------- */
.xc-dashboard-root.xc-dash-editing			/* The top-level dashboard container */
{
	padding-left: 10px;
	padding-right: 10px;
}

.xc-dash-editing .widget-panel		/* A panel which houses widgets */
{
	border: 1px dashed #AAA;
	min-height: 200px;
	min-width: 100px;
	padding: 10px ;
	margin: 0px;
	background: #FAFAFA;
}

.xc-dash-editing .xc-dash-panel-title
{
	height: 20px;
}

.xc-dash-editing .widget-panel .widget-drag-to-placeholder
{
	width: 100% ;
	height: 100px ;
	border: 1px dotted #AAA ;
	background: #DDD ;
}

.xc-dash-editing .widget .widget-title-bar
{
	
	background: #C5EAFC;
	border-bottom: 1px solid #57BCDD;
	
	transition: border-color linear 1s, background linear 1s, padding linear 1s;
	
}

.xc-dash-editing .widget-container				/* A widget */
{
	position: relative;
}

.xc-dash-editing .widget-panel.drag-hover-over
{
	background-color: #F6FFEC;
	border: 1px solid #888  ;
}


.widget-editing-covering
{
	display: none ;
}
.xc-dash-editing .widget-editing-covering
{
	display: block;
	position: absolute;
	
	opacity: 0.9;
	
	margin: 5px 5px;

    bottom:0;
    top:0;
    left:0;
    right:0;
	
	border-radius: 3px;

	background-color: rgb(232, 241, 242) ;
	border: 1px solid #CCC; 
	z-index: 1;
}
.xc-dash-editing .widget-editing-helper-container:hover .widget-editing-covering
{
	background-color: #D7F7E3;
	border: 1px solid #AAA;
}

.xc-dash-editing .widget
{
	transition: all linear .5s;
	border: 1px solid #CCC;
	box-shadow: 4px 4px 15px rgba(0,0,0,0.2);
}

.widget-editing-helper-container
{
	display: none;
}
.xc-dash-editing .widget-container .widget-editing-helper-container
{
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;

	cursor: move;
}

.xc-dash-editing .widget-container .widget-editing-helper-content
{
	margin: auto;

	padding-top: 6px;
	z-index: 10;
	position: relative;
}

.widget-editing-helper-content .drag-helper-text
{
	font-size: 16px;
	margin-bottom: 20px;
}

.widget-editing-helper-content .background
{
	padding-left: 10px ;
	cursor: initial;
	float: left;
	
	/*
		background: #FAFAFA;
		box-shadow: 0px 0px 40px 9px #FAFAFA
	*/
}

.widget-editing-helper-content .title
{
	font-size: 16px;
	margin-bottom:15px;
	
	float: left;
	color: #1EBD59;
}

.widget-editing-helper-content .heights
{
	float: left;
}

.widget-editing-helper-content .heights.horizontal .xc-radio-button
{
	float: left;
}

.widget-editing-helper-content .xc-radio-button
{
	padding: 5px 7px;
	margin: 2px 2px;
	cursor: pointer ;
	background-color: #B2D7E7;
	border: 1px solid #1EBD59;
}

.widget-editing-helper-content .xc-radio-button.checked 
{
	opacity: 1;
	background-color: #1EBD59;
	border: 1px solid #1EBD59;
	color: #FAFAFA;
}

.widget-editing-helper-container .widget-title-bar
{
	z-index: 5;
	position: relative;
	margin: 5px 5px;
	background-color: #8ECBE5;
	border-top-right-radius: 2px;
	border-top-left-radius: 2px;
}
.widget-editing-helper-container:hover .widget-title-bar
{
	background-color: #1EBD59;
}

.xc-radio-button.widget-size-button-very-short
{
	height: 5px;
}
.xc-radio-button.widget-size-button-short
{
	height: 15px;
}
.xc-radio-button.widget-size-button-medium
{
	height: 25px;
}
.xc-radio-button.widget-size-button-tall
{
	height: 35px;
}
.xc-radio-button.widget-size-button-very-tall
{
	height: 45px;
}

.xc-dash-editing .widget-inner-content
{
	opacity: .25;
	transition: all linear .2s;
}


/* ------------------------------------------------------------- Dashboard Templates -------------------------------------------------------------

	These styles are only used to position the layout panels for each template.
	Please do NOT use these styles to configure widgets or standard layout options,
	if done right, these should only be for the panels in the layouts.
*/



/* ---------------------------------- Panels1_OneTopOneBottomTwoMiddle ---------------------------------- */
#Panels1_OneTopOneBottomTwoMiddle #Panel0,
#Panels1_OneTopOneBottomTwoMiddle #Panel3,
Panels_TwoColumns_PlusOneFullWidth_MyWorkspace #Panel2
{
    display: block;
    width: inherit;
}
#Panels1_OneTopOneBottomTwoMiddle #Panel0,
 #Panels1_OneTopOneBottomTwoMiddle #Panel1, 
 #Panels1_OneTopOneBottomTwoMiddle #Panel2, 
 #Panels1_OneTopOneBottomTwoMiddle #Panel3
{
	margin-bottom: 0px;
	margin-top: 0px;
}
.xc-dash-editing #Panels1_OneTopOneBottomTwoMiddle #Panel0,
 .xc-dash-editing #Panels1_OneTopOneBottomTwoMiddle #Panel1, 
 .xc-dash-editing #Panels1_OneTopOneBottomTwoMiddle #Panel2, 
 .xc-dash-editing #Panels1_OneTopOneBottomTwoMiddle #Panel3
{
	margin-bottom: 5px;
	margin-top: 5px;
}

#Panels1_OneTopOneBottomTwoMiddle #PanelDivider,
#Panels1_OneTopOneBottomTwoMiddle_MyWorkspace #PanelDivider,
#Panels_TwoColumn_MyWorkspace #PanelDivider,
Panels_TwoColumns_PlusOneFullWidth_MyWorkspace #PanelDivider 
{
    width: 0.3%;
}

#Panels1_OneTopOneBottomTwoMiddle #Panel1,
#Panels1_OneTopOneBottomTwoMiddle_MyWorkspace #Panel1 {
	float: left;
	width: 49%;
	padding-right: 10px;
}

#Panels_TwoColumn_MyWorkspace #Panel2,
#Panels_TwoColumns_PlusOneFullWidth_MyWorkspace #Panel3
{
    float: left;
    width: 50%;
    padding-right: 10px;
}

#Panels_TwoColumn_MyWorkspace #Panel0, 
#Panels_TwoColumns_PlusOneFullWidth_MyWorkspace #Panel0 
{
	float: left;
	width: 50%;
	padding-right: 10px;
}

#Panels1_OneTopOneBottomTwoMiddle #Panel2, 
#Panels1_OneTopOneBottomTwoMiddle_MyWorkspace #Panel2
{
    float: right;
    width: 49%;
}

#Panels_TwoColumn_MyWorkspace #Panel1,
#Panels_TwoColumn_MyWorkspace #Panel3,
#Panels_TwoColumns_PlusOneFullWidth_MyWorkspace #Panel1, 
#Panels_TwoColumns_PlusOneFullWidth_MyWorkspace #Panel4 
{
    float: right;
    width: 50%;
    padding-left: 10px;
}

/* ---------------------------------- Panels3OneTopTwoBottom ---------------------------------- */
#Panels2Column #Panel0 {
    float: left;
}

#Panels2Column #Panel1
{
	float: right;
}


/* ---------------------------------- PanelsSingle ---------------------------------- */
#PanelsSingle #Panel0
{
	display: block;
	width: inherit;	
}


/* ---------------------------------- Panels2Grid ---------------------------------- */
#Panels2Grid
{
	vertical-align: top;
	padding: 0px 10px;
	margin-top: 5px;
}

#Panels2Grid .widget-panel
{
	margin: 10px 0px 0px 0px;
}

#Panels2Grid > table > tr, #Panels2Grid > table > tbody > tr
{
	vertical-align: top;
}

	#Panels2Grid > table > tr > td, #Panels2Grid > table > tbody > tr > td
	{
		width: 45%;
	}

	#Panels2Grid .widget
	{
		min-width: 230px;
	}

#Panels2Grid .panel-horiz-separator
{
	width:1%;
}